45 lines
747 B
Vue
45 lines
747 B
Vue
|
<template>
|
||
|
|
<div class="toast">
|
||
|
|
<div class="toast-wrap">
|
||
|
|
<div class="text">
|
||
|
|
{{toastMsg}}
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
import { mapState } from 'vuex'
|
||
|
|
export default {
|
||
|
|
data () {
|
||
|
|
return {}
|
||
|
|
},
|
||
|
|
computed: mapState({
|
||
|
|
toastMsg: state => state.com.toastMsg
|
||
|
|
})
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="stylus" scoped>
|
||
|
|
.toast
|
||
|
|
.toast-wrap
|
||
|
|
position fixed
|
||
|
|
z-index 10001
|
||
|
|
width 100%
|
||
|
|
height 1rem
|
||
|
|
line-height 1rem
|
||
|
|
text-align center
|
||
|
|
left 50%
|
||
|
|
top 50%
|
||
|
|
transform translate(-50%, -50%)
|
||
|
|
.text
|
||
|
|
display inline-block
|
||
|
|
width auto
|
||
|
|
text-align center
|
||
|
|
padding 0 .5rem
|
||
|
|
border-radius 10px
|
||
|
|
background #858586
|
||
|
|
font-size .32rem
|
||
|
|
color #fff
|
||
|
|
</style>
|