在线观看不卡亚洲电影_亚洲妓女99综合网_91青青青亚洲娱乐在线观看_日韩无码高清综合久久

鍍金池/ 問答/HTML/ vue 父組件向子組件通過props傳遞數(shù)據(jù)不能用v-model綁定?

vue 父組件向子組件通過props傳遞數(shù)據(jù)不能用v-model綁定?

  1. 父組件代碼
    <template>
        <div>
            <item1 :test="{test:1}"></item1>
        </div>
    </template>
  1. 子組件代碼
<template>
    <div>
        <input v-model="test.test">
    </div>
</template>
<script>
    export default {
        props: {
            test: Object
        }
    }
</script>

此時我們在子組件input框中任意修改是不報錯的,應為我們通過父組件傳過來的值是復合類型數(shù)據(jù),當我們改為普通類型的數(shù)據(jù)時就會報錯,如下

clipboard.png

報錯的原因是我們修改如下

  1. 父組件代碼
    <template>
        <div>
            <item1 :test="1"></item1>
        </div>
    </template>
  1. 子組件代碼
<template>
    <div>
        <input v-model="test">
    </div>
</template>
<script>
    export default {
        props: {
            test: Number
        }
    }
</script>

有誰能解釋下么?

回答
編輯回答
醉淸風

1.如果父祖件傳過來的是基本數(shù)據(jù)類型,其實子組件用v-model一樣可以改,給你報的是warning而不是報錯,也就是說,vue是可以由子組件直接修改父祖件的值的,只是 強烈不推薦

2.為什么基本數(shù)據(jù)類型會報warning而復雜數(shù)據(jù)類型不會?這考的純粹就是你對js里兩種數(shù)據(jù)類型的內(nèi)存的理解,網(wǎng)上搜索詳細的資料有很多,展開講也能講很多,題主可以按需補相關的知識。

3.最后,尤雨溪本人不反對這種方式,可以作為一個父子組件間雙向通信的簡易方案。

2017年6月26日 02:09
編輯回答
鐧簞噯

vue 單向數(shù)據(jù)流動 子組件想修改父組件的值 需要用 $emit

第一次綁定的是引用數(shù)據(jù)類型,綁定的是引用地址,子組件修這個引用類型的值,vue不會報警告。
第二次 基礎類型值 子組件直接修改 父組件傳遞的props vue會拋出警告。

2017年4月6日 11:49
編輯回答
尕筱澄

以前是可以的,貌似有個版本更新之后就會報警告了,子組件不能直接修改props數(shù)據(jù)。能修改的方式很多,可以用emit觸發(fā),或者搭一個bus線,或者用vuex。直接修改的方式不提倡。

2017年4月19日 18:54
編輯回答
陌璃

你可以不用props 鏈接描述

參考一下這個 也可以實現(xiàn)你的需求

2017年6月14日 05:08
編輯回答
維她命

報錯信息不是說的很清楚了不能直接修改props
你可以設置:value.sync

2017年10月13日 14:23