USDT跑分软件开发系统

对于state、getter、mutation、action来说usdt跑分软件开发(T:I8O、285I、O282V林楠),如果每次使用的时候都用this.$store.state、this.$store.getter等引用,会比较麻烦,代码也重复和冗余,我们可以用辅助函数来帮助我们生成要的代码,辅助函数有如下四个:

mapState(namespace, map)        ;用于获取state
mapGetters(namespace, map)       ;用于获取getters
mapMutations(namespace, map)      ;用于获取mutations
mapActions(namespace, map)          ;用于获取actions


每个辅助函数都可以带两个参数:

  namespace    ;命名空间,也就是模块名

  map       ;要获取的信息

map有两种用法,可以是对象(键名是当前Vue实例设置的变量名,值是从store要获取的变量名)或者字符串数组(此时获取和设置的变量名为同一个)。

注:使用辅助函数需要在根节点注入store

ps:很多新手可能只会使用辅助函数,不知道还可以用this.$store.state,this.$store.getter这些用法…

这些辅助函数返回的都是一个对象,我们可以配合ES6的对象展开运算符,我们可以极大地简化写法,例如:

<!DOCTYPE html>
<html lang=”en”>
<head>

<meta charset="UTF-8">
<title>Document</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2.5.16/dist/vue.js"></script>
<script src="https://unpkg.com/vuex@3.1.0/dist/vuex.js"></script>

</head>
<body>

<div id="app">
    <p>{{no}}</p>
    <p>{{No}}</p>
    <button @click="test1">测试1</button>
    <button @click="test2">测试2</button>
</div>
<script>
    const store = new Vuex.Store({
        state:{no:100},
        getters:{
            No:function(state){return state.no+100}
        },
        mutations:{
            increment(state,payload){state.no+=payload.no;}
        },
        actions:{
            increment({commit},info){
                setTimeout(function(){
                    commit('increment',info)
                },500)
            }
        }
    })

评论

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

这个站点使用 Akismet 来减少垃圾评论。了解你的评论数据如何被处理