解決vue 子組件修改父組件傳來的props值報錯問題
更新時間：2019年11月09日 09:33:59 作者：254980080
今天小編就為大家分享一篇解決vue 子組件修改父組件傳來的props值報錯問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
vue不推薦直接在子組件中修改父組件傳來的props的值，會報錯
[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: "result" (found in component )
<input v-model="currentSearch" type="text" class="input-search" @keydown.enter="doSearch">
export default {
name:"round-search-bar",
props:['search'], //父組件傳來的值
data(){
return {
currentSearch: this.search //通過data, 定義新變量currentSearch, 這樣currentSearch的值變更時，不會影響父組件傳來的search的值
}
},
methods: {
doSearch(){
Util.searchAPI(this.$router,this.currentSearch)
}
},
}
以上這篇解決vue 子組件修改父組件傳來的props值報錯問題就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。
相關(guān)文章
詳解使用jest對vue項(xiàng)目進(jìn)行單元測試
這篇文章主要介紹了詳解使用jest對vue項(xiàng)目進(jìn)行單元測試，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-09-09
基于vue2的table分頁組件實(shí)現(xiàn)方法
這篇文章主要為大家詳細(xì)介紹了基于vue2的table分頁組件實(shí)現(xiàn)方法，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-03-03
這篇文章主要介紹了Vuejs第十篇之vuejs父子組件通信的相關(guān)資料,本文介紹的非常詳細(xì)，具有參考借鑒價值，需要的朋友可以參考下2016-09-09
這篇文章主要為大家介紹了vite的proxy查看真實(shí)請求地址方式詳解,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-11-11
Vue2.0父組件與子組件之間的事件發(fā)射與接收實(shí)例代碼
這篇文章主要介紹了Vue2.0父組件與子組件之間的事件發(fā)射與接收實(shí)例代碼,需要的朋友可以參考下2017-09-09
這篇文章主要介紹了vue組件內(nèi)部引入外部js文件的方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01
vue實(shí)現(xiàn)點(diǎn)擊按鈕下載文件功能
這篇文章主要介紹了vue中點(diǎn)擊按鈕下載文件，本文通過實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價值,需要的朋友可以參考下2019-10-10
這篇文章主要介紹了關(guān)于Echarts餅圖圖例太長的解決方案，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教2023-02-02
在vue3項(xiàng)目中實(shí)現(xiàn)國際化的代碼示例
國際化就是指在一個項(xiàng)目中，項(xiàng)目中的語言可以進(jìn)行切換（中英文切換），那么在實(shí)際項(xiàng)目中是如何實(shí)現(xiàn)的呢，本文就給大家詳細(xì)的介紹實(shí)現(xiàn)方法,需要的朋友可以參考下2023-07-07
淺談在vue-cli3項(xiàng)目中解決動態(tài)引入圖片img404的問題
這篇文章主要介紹了淺談在vue-cli3項(xiàng)目中解決動態(tài)引入圖片img404的問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08