Vue：针对Vuex绑定的计算与数据（）。

Question

（注意：我并不是在问如何使用watch）。

我有此表单模板，并想将其绑定到一些变量，例如objectvalue3，在Vuex存储中跟踪的变量（注意：一页上可能存在不同的表单，所以props.formname告诉表单要在哪里查看）。

<template>
    <div>
    Tracking formname_:{{formname_}}:
        <form method="post" autocomplete="off">
            <input type="text" name="objectvalue3" :value="objectvalue3" />
            <input type="submit" class="btn btn-primary btn-success" value="Track" @click.prevent="write">        
        </form>
    </div>
</template>
....
props: {
    formname: {
        type: String,
        default: "main"
    }
},

在跟踪它data确实没有工作-即形式没有更新-它只是不断的vuex被初始化为值：

data: function() {
    return {
        formname_: this.formname
        ,objectvalue3: this.$store.state.tracker[this.formname].objectvalue3
},

但是使用computed作品。

computed: {
    objectvalue3: function() {
        return this.$store.state.tracker[this.formname].objectvalue3
    }

我知道computed需要计算时必须使用。但是这里没有真正的计算。除非，是不是通过哈希查找this.formname告诉表单tracker要看哪个属性导致直线data失败？这是vuex特有的吗？

Answer 1

尝试以下方法：

data: function() {
    return {
        formname_: this.formname,
        tracker: this.$store.state.tracker[this.formname]
},

然后：

<input type="text" name="objectvalue3" :value="tracker.objectvalue3" />

这应该起作用，因为数据的tracker对象指向存储中的那个，然后只要那里的值更改，它的tracker对象中的位置也会更改。

computed 之所以起作用，是因为它侦听其中使用的变量的更改，而数据则不行，因为它在执行时会应用第一个值，并且不会跟踪更改。