如何使用手錶功能在vue js

能否請你告訴我如何在vue js中使用手錶功能。我嘗試過使用，但是我得到了這個錯誤。如何使用手錶功能在vue js

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>

https://plnkr.co/edit/hVQKk3Wl9DF3aNx0hs88?p=preview

我創建了不同的成分和主要成分

var AddTODO = Vue.extend({ 
    template: '#add-todo', 
    props: ['m'], 
    data: function() { 
     return { 
      message: '' 
     } 
    }, 
    methods: { 
     addTodo: function() { 
      console.log(this.message) 
      console.log(this.m); 
      this.m =this.message; 
     }, 
    }, 
});

看屬性當我嘗試添加item我得到這個錯誤。 步驟來重現此錯誤的輸入字段

輸入任何東西，然後點擊Add button

來源

2017-09-02 naveen

無法重現，工作正常 – dfsq

this.m =this.message;

此行的問題，

我們建議您不要修改道具直接...

改爲創建一個數據屬性，然後修改它。

它顯示警告，因爲您正在修改道具項目，只要父組件重新呈現，道具值將被覆蓋。

來源

2017-09-02 08:57:50

如何使用手錶方法 – naveen

爲什麼你要使用的手錶看屬性？。見我要一個項目添加到列表中？你可以解釋一下:) –

我只想檢查如何檢查我的財產的新舊價值 – naveen

只要您在組件的外部更改其值，組件的道具就會自動更新。因此，試圖從組件內改變屬性的值是一個壞主意：您應該使用道具作爲只讀。如果你想使用道具爲你的一些組件的data的初始值，你可以簡單地聲明這樣說：

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

話雖這麼說，如果你想一個道具的值從內部改變一個組件能夠在你的外部使用你的重新分配的道具，你這樣做是錯誤的。你應該如何處理這個問題是通過使用Vue's custom events。記住，Vue公司的文檔狀態：

在Vue公司，親子組件關係可以概括爲道具下來，活動了。父母通過道具將數據傳遞給孩子，孩子通過事件向父母發送消息。

來源

2017-09-02 11:19:27

如何使用手錶功能在vue js

回答

相關問題