Vue:计算vuex绑定的vuex数据()？

Question

(注意:我不是在问如何使用watch)。

我有这个表单模板，并希望将它绑定到Vuex存储中跟踪的一些变量，例如objectvalue3 (注意:不同的表单可能出现在一个页面上，因此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之所以工作，是因为它侦听在其中使用的变量中的变化，而数据不工作，因为它在执行时应用了第一个值，并且不跟踪更改。