關於vue修飾符 sync

2021-09-28 23:05:14 字數 523 閱讀 9799

vue是單項資料流,所以要對他進行雙向資料繫結的時候需要用到.sync修飾符,最常用的是visible.sync

在子元件裡寫:this.$emit(『update:visible』, visible), 使用update:my-prop-name 的模式觸發事件

父元件裡:

"isvisible" @update:visible=

"val=>isvisible=val"

>

<

/components>

//簡寫

"isvisible"

>

<

/components>

子元件:

this

.$emit

('update:visible'

, visible)

當乙個子元件改變了乙個 prop 的值時,這個變化也會同步到父元件中所繫結

深入解讀Vue修飾符sync

在一些情況下,我們可能會需要對乙個 prop 父子元件傳遞資料的屬性 進行 雙向繫結 在vue 1.x 中的 sync 修飾符所提供的功能。當乙個子元件改變了乙個帶 sync 的prop的值時,這個變化也會同步到父元件中所繫結的值。這很方便,但也會導致問題,因為它破壞了單向資料流。資料自上而下流,事...

Vue 指令及修飾符 sync 詳解

目錄 1 指令及其語法 2 指令的修飾符 3 都有哪些指令修飾符 4 深入理解 sync 指令修飾符 vue 模板語法中的 v text v html v pre 都是指令,它起到一種命令或指示的效果,語法 如下 v 指令名 引數 值如 v on click add 如果值裡沒有特殊字元,則可以不加...

深入理解vue 修飾符sync

示例 如下 bar comp 會被擴充套件為 bar update foo val bar val comp 當子元件需要更新 foo 的值時,它需要顯式地觸發乙個更新事件 this emit update foo newvalue 猛一看不明白,下邊通過乙個例項 彈窗的關閉事件 來說明這個 到底是...