怎麼理解 Vue 的單向資料流?

2022-10-09 07:42:09 字數 506 閱讀 5005

1. vue 的單向資料流:指資料一般從父元件傳到子元件,子元件沒有權利直接修改父元件傳來的資料,即子元件從 props 中直接獲取的資料,只能請求父元件修改資料再傳給子元件。父級屬性值的更新會下行流動到子元件中。

2. 為什麼不能子元件直接修改父元件傳來的值呢?父元件的值可能會不斷發生變化,那麼如果我們子元件對父元件傳來的值比如說 props 有乙個 number,子元件收到了 number=1,在收到後,子元件直接改變number 的值為 5,去做些事情,但還未做時父元件資料更新了,傳過來乙個值 3,也就是說子元件剛將其變為 5,父元件又把它變成了 3,可能影響子元件的使用。說的官方一些,就是父元件的值更新時,子元件中 props 的值也會發生更新。

3. 在子元件中直接用 v-model 繫結父元件傳過來的資料是不合理的,如果希望修改父元件傳給子元件的值:

(1)在子元件 data 中建立乙個變數獲取 props 中的值,再改變這個 data 中的值。

(2)子元件使用 $emit 發出乙個事件,讓父元件接收去修改這個值。

怎麼理解 Vue 的單向資料流?

1.vue 的單向資料流 指資料一般從父元件傳到子元件,子元件沒有權利直接修改父元件傳來的資料,即子元件從 props 中直接獲取的資料,只能請求父元件修改資料再傳給子元件。父級屬性值的更新會下行流動到子元件中。2.為什麼不能子元件直接修改父元件傳來的值呢?父元件的值可能會不斷發生變化,那麼如果我們...

vue 單向資料流 雙向繫結

在react中是單向資料繫結,而在vue中的特色是雙向資料繫結。但是其實就我個人的理解是 其實無論是vue還是react其實還是提倡單向資料流去管理狀態,這一點在vuex和redux狀態管理器上體現的很明顯。只是vue為ui控制項提供了雙向資料繫結的方式,在一些需要實時反應使用者輸入的場合會非常方便...

vue中單向資料流小結

root div 父元件向子元件傳多個引數時,可以將要傳的引數置入params中,呼叫子元件時直接繫結v bind params 等同於將引數乙個乙個展開傳遞形式 例如 v bind params content params.content 其餘引數類似 元件傳參時,引數名建議不要使用駝峰,htm...