Question

我尝试使用$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'});
}

Answer 1

正确的语法是Vue.set(target, index, value)：

Vue.set(app.messageBox, 0, {message: 'aaa'});

const app = new Vue({
  el: '#app',
  data: function(){
    return {
      messageBox: [{
        id: 1,
        message: 'first'
      }, {
        id: 2,
        message: 'second'
      }]
    };
  }
});

setTimeout(() => {
  Vue.set(app.messageBox, 0, {message: 'aaa'});
}, 1000);

<script src="https://unpkg.com/vue@2.5.2"></script>

<div id="app">
  <p v-for="msgBox of messageBox">{{msgBox.message}}</p>
</div>

Vue.js. $ set不是一个函数

1 个答案: