一、[Vue warn]: The data property "inputUserData" is already declared as a prop. Use prop default value instead.

意思："inputUserData"這個值已經(jīng)聲明成了一個prop數(shù)據(jù)，掛載的時候?qū)⒛J(rèn)使用prop中的"inputUserData"。

報錯原因：在props中聲明了一次，在data屬性中又聲明了一次。

解決：把data屬性中的"inputUserData"刪掉。

二、[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: "inputUserData"

意思：避免修改prop里面的值，建議用基于"inputUserData"的值或者計算屬性修改"inputUserData"。

報錯原因：

在子組件中，"inputUserData"這個值放在v-model屬性中，存在被修改覆蓋的風(fēng)險，后者存在其他被修改的可能，比如調(diào)用某個方法把"inputUserData"里的值改了，

措施：如果prop中的"inputUserData"接收的是初始值，將要對其加工，可以放在計算屬性中進行加工，或者放到另一字段比如“"inputUserDataCopy”接收"inputUserData"值，然后直接對"inputUserDataCopy"進行操作

三、在解決prop問題的時候，嘗試用this.$parent.[父組件身上的值]來獲取父組件身上的數(shù)據(jù)常遇到的問題：this.$parent.[父組件身上的值]返回undefind。

原因：你在A本地組件中使用了B本地子組件，但是把B本地子組件包裹在了一個以上的elmentUI等其他第三方組件中，也就是說這個本地B組件有N個父組件，純純使用this.$parent.[父組件身上的值]，你只調(diào)用了一層父組件身上數(shù)據(jù)。

措施：在子組件相應(yīng)的位置打印console.log(this.$parent)，然后一層一層地從$parent下找，就會找到你想要的數(shù)據(jù)了。如果要獲取，就點$parent地用下去，比如兩層父組件，那就this.$parent.$parent.value。

到此這篇關(guān)于Vue中props報錯或問題解決的文章就介紹到這了,更多相關(guān)Vue props報錯內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論