其他分享
首页 > 其他分享> > vux使用和帮助函数

vux使用和帮助函数

作者:互联网

store   index.js import Vue from 'vue' import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({      state: {     duan:"192",     age:"15"   },   mutations: {     edit(state,payload){       state.duan = payload   }   },   getters:{     nameInfo(state){       return "姓名:"+state.age     },     fullInfo(state,getters){       return "姓名"+ getters.nameInfo +'年龄:'+state.age     } ,     namepac(state,getters){       return state.age+getters.nameInfo+getters.fullInfo+getters.fullInfo     }   },   actions: {     aEdit(context,k){       setTimeout(()=>{           context.commit('edit',k)       },2000)   }   },   modules: {   },   strict:true })   -----------------------------------------   组件中使用 <template>   <div class="hello">     <h1>{{ msg }}</h1>
    <div>{{this.$store.state.duan}}</div>     ---<p>{{duan}}</p>---     <p>{{localState}}</p>     <p @click="aa({age:18})">{{countss}}</p>     <p>{{this.$store.getters.fullInfo}} </p>     --     <p> {{this.$store.getters.namepac}}</p>     =-     <p>{{namepac}}</p>   </div> </template>
<script> import {mapState,mapGetters,mapActions} from "vuex" import store from "../store/index"; export default {   name: "HelloWorld",   props: {     msg: String   },   created () {         setTimeout(()=>{          this.$store.commit("edit",{age:15,sex:'男'});       },5000)        },   data() {     return {       localState: 123     };   },   methods: {     aa() {       this.$store.commit("edit",25);
            this.$store.dispatch('aEdit',{age:18})     }   },   computed: {      ...mapState(["duan"]              ),       ...mapActions(['aEdit']),      ...mapGetters(["namepac"]),     // count() {     //   return store.state.data;     // },     countss() {       return store.state.duan * this.localState + this.msg;     }   } }; </script>
<!-- Add "scoped" attribute to limit CSS to this component only -->      

标签:帮助,return,函数,age,getters,state,duan,vux,store
来源: https://www.cnblogs.com/1609359841qq/p/12986689.html