更新 vue.js 中的數據屬性/對象

Question

有沒有辦法以編程方式更新 vue.js 中的data對象/屬性？ 例如，當我的組件加載時，我的數據對象是：

data: function () {
    return {
        cars: true,
    }
}

觸發事件后，我希望data對象看起來像：

data: function () {
    return {
        cars: true,
        planes: true
    }
}

我試過了：

<script>

module.exports = {

    data: function () {
        return {
            cars: true
        }
    },

    methods: {
        click_me: function () {
            this.set(this.planes, true);
        }
    },

    props: []

}

</script>

但這給了我錯誤this.set is not a function 。 有人可以幫忙嗎？

提前致謝！

Answer 1

Vue 不允許動態地將新的根級響應屬性添加到已創建的實例中。 但是，可以將反應屬性添加到嵌套對象，因此您可以創建一個對象並添加一個新屬性，如下所示：

data: function () {
    return {
        someObject:{
            cars: true,
    }
}

並使用vm.$set方法添加屬性：

methods: {
        click_me: function () {
            this.$set(this.someObject, 'planes', true)
        }
    }

對於vue 1.x使用Vue.set(this.someObject, 'planes', true)

反應性