相关疑难解决方法(0)

我仔细阅读并重新阅读了Vue文档" Resetivity in Depth"以及vm.$ set和Vue.set的API,但我仍然很难确定何时使用哪个.我能够区分这两者是很重要的,因为在我目前的Laravel项目中,我们动态地在对象上设置了很多属性.

文档中的区别似乎是vm.$ set为"For Vue instance"的语言,而Vue.set为"For plain data objects"且Vue.set为global:

但是,有一些方法可以在创建实例后添加属性并使其具有反应性.

对于Vue实例,您可以使用$ set(path,value)实例方法:

vm.$set('b', 2)
// `vm.b` and `data.b` are now reactive

对于纯数据对象,可以使用全局Vue.set(对象,键,值)方法:

Vue.set(data, 'c', 3)
// `vm.c` and `data.c` are now reactive

最后,我想知道上面做的第三个"选项"(用于一次添加多个属性)是否可以用作上述2个选项中的任何一个的等效替代(通过仅添加1个属性而不是多个) ？

有时您可能希望为现有对象分配许多属性,例如使用Object.assign()或_.extend().但是,添加到对象的新属性不会触发更改.在这种情况下,使用原始对象和mixin对象的属性创建一个新对象:

// instead of `Object.assign(this.someObject, { a: 1, b: 2 })`
this.someObject = Object.assign({}, this.someObject, { a: 1, b: 2 })

我使用以下数据创建了一个 vue 组件：

data: function () {
    return {
        hwshow: [false, false, false, false, false, false, false, false, false, false],
    };
},

以及切换这些值的方法：

methods: {
    fliphw: function (index) {
        this.hwshow[index] = !this.hwshow[index];
        console.log(this.hwshow);
    },
},

在 html 我有

<li v-show="hwshow[0]">foo bar</li>

我知道正在调用 fliphw 函数（因为 console.log），但是当 的值为hwshow[0]true 时 foo bar 仍然没有出现。当我切换到使用布尔值而不是布尔值数组时，它可以工作。为什么？如果我无法访问一组布尔值，还有什么其他解决方案可以解决这个问题？

我正在尝试使用$set函数修改存储在vuejs中的数据.但我得到了这个错误:TypeError: app.messageBox.$set is not a function.

这是关于我如何定义app和messageBox的代码:

app = new Vue({
    el: '#app',
    data: {
        messageBox: [{
            id: 1,
            message: 'first'
        }, {
            id: 2,
            message: 'second'
        }]
    }
});

在另一个js文件中,我尝试修改messageBox中的数据:

function test() {
    app.messageBox.$set(0, {message: 'aaa'});
}