zoukankan      html  css  js  c++  java
  • vuex

    store.js文件

      import  Vue  from  'vue'

      import  Vuex  from  'vuex'

      Vue.use(Vuex)

      export  default  Vuex.Store({

        state: {  // this.$store.state.num

          num: 1

        },

        getters: {  // this.$store.getters.count

          count(state){

            return  state.num + 1

          }

        },

        mutations: {

          ADD(state){  // this.$store.commit("ADD")

            state.num ++;

          }

        },

        actions: {

          ADD({commit}){  // this.$store.dispatch("ADD")

            commit("ADD")

          }

          ADD(context){

            context.commit("ADD")

          }

        }

      })

      辅助函数 mapGetters,mapActions

      组件:

        <p>{{count}}</p>

        <p  @click="ADD">点击事件</p>

        import  {mapGetters, mapActions}  from  'vuex'

        computed: {

          ...mapGetters["count"],

          title( ){

            return this.title + 'aa'

          }

        },

        methods: {

          ...mapActions["ADD"],

          add( ){

            console.log("本文件方法")

          }

        }

  • 相关阅读:
    vue动态改变样式
    前端上传到七牛云图片
    vue实现发送验证码60秒
    移动端使用lib-flexible
    作用域插槽
    vue中的keep-alive
    vue优化
    vue动画move的实现
    vue自带的动画效果
    v-model的理解
  • 原文地址:https://www.cnblogs.com/cuishuangshuang/p/13466648.html
Copyright © 2011-2022 走看看