modal元件的 sync修飾符

2021-10-06 09:02:53 字數 427 閱讀 7171

之前工作中在自定義元件時有用到modal元件,官方文件裡都會在modal裡寫

:visible.sync

="visible"

on-close

="close"

>

.sync修飾符:當值更新時,會顯示觸發更新事件

而子元件接受父元件傳值時,不能對其直接進行改變

因此,自定義元件裡要把這個修飾符去掉,不然關閉modal時會報錯

理解有誤

該修飾符可以使得子元件優雅的修改父元件的資料

由於vue不能在子元件直接修改props傳過來的簡單型別的值

經常用觸發事件的方式修改父元件的值如emit

sync修飾符的使用

目的 再子元件去改變父元件的值的時候會有明顯的 樣式,方便維護,為什麼要這樣為什麼不用v molder,因為v model中已經說明了不要直接去改變v model中的值,可以去拷貝在改變,在傳值,這個也是v model和sync修飾符的區別。再我應用了後我認為就是 再父元件上省去了觸發事件,並且直接...

修飾符 sync的用法

單個props資料繫結用法 物件型props資料繫結用法 v if show 我是子元件div click hidden 子元件的取反按鈕button div const son show.sync control son click change 父元件的取反按鈕button div const ...

sync修飾符的用法

首先我們需要知道 子元件如何向父元件傳值。子頁面 optitle.vue var data 10 第乙個引數對應父頁面自定義的事件,第二個值代表要更新的值 this emit update data 父頁面 引入元件 import toptitle from components 在自定義標籤上自定...