Javascript 如何在vue js中使用watch函数

您能告诉我如何在vue js中使用watch函数吗？我试图使用，但出现了此错误

vue.js:485 [Vue warn]: Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. Instead, use a data or computed property based on the prop's value. Prop being mutated: "m"

found in

---> <AddTodo>
       <Root>

当我尝试添加

项时

出现此错误。 复制此错误的步骤

在输入字段中键入任何内容，然后单击添加按钮

这条线就是问题所在

建议您不要直接修改道具

而是创建一个数据属性，然后对其进行修改

---

它显示警告，因为您正在修改道具项目，每当父组件重新渲染时，道具值将被覆盖。

一旦您在组件外部更改道具值，组件中的道具将自动更新。 因此，尝试从组件内部更改属性的值是一个坏主意：应该将道具用作只读。 如果要使用道具作为某些组件的

数据的初始值

，只需通过以下方式声明：

data: function () {
    return {
        changeable: this.receivedProp;
    }
},

也就是说，如果您试图从组件内部更改道具的值，以便能够在组件外部使用重新分配的道具，那么您的做法是错误的。处理此问题的方法是使用。 请记住，正如Vue的文档所述：

在Vue中，父子组件关系可以概括为道具下降、事件上升。父对象通过道具将数据向下传递给子对象，子对象通过事件向父对象发送消息

---

无法复制，无法查看属性。请参阅我想使用“查看”方法将项目添加到列表中为什么要使用“查看”？你能解释一下吗：）我只是想检查如何检查我的财产的新旧价值。你可以向数据添加一个项目，然后在created（）生命周期方法中，将prop的值分配给你的数据项目。例如：

this.dataItem=this.propItem

然后以正常方式监视dataItem。

this.m =this.message;

data: function () {
    return {
        changeable: this.receivedProp;
    }
},