vue.js – 带有setter的mapState

前端之家收集整理的这篇文章主要介绍了vue.js – 带有setter的mapState前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我想通过mapState分配setter方法.我目前使用一种解决方法,我将我感兴趣的变量(todo)命名为临时名称(storetodo),然后在另一个计算变量todo中引用它.
methods: {
    ...mapMutations([
        'clearTodo','updateTodo'
    ])
},computed: {
    ...mapState({
        storetodo: state => state.todos.todo
    }),todo: {
        get () { return this.storetodo},set (value) { this.updateTodo(value) }
    }
}

我想跳过额外的步骤并直接在mapState中定义getter,setter.

我为什么要这样做?

通常的方法是使用mapMutations / mapActions& mapState / mapGetters
没有我上面说明的计算得到/设置组合,并直接在HTML中引用变异:

<input v-model='todo' v-on:keyup.stop='updateTodo($event.target.value)' />

getter / setter版本允许我简单地写:

<input v-model='todo' />

解决方法

您不能在mapState中使用getter / setter格式

您可以尝试直接返回get()中的状态并从computed属性删除mapState

computed: {
    todo: {
        get () { return this.$store.state.todos.todo},set (value) { this.updateTodo(value) }
    }
}

这是一个相关但不相同的JsFiddle example

猜你在找的JavaScript相关文章