99热在线精品一区二区三区_国产伦精品一区二区三区女破破_亚洲一区二区三区无码_精品国产欧美日韩另类一区

vue的官網(wǎng)介紹非常不錯，先通讀一遍。

目前成都創(chuàng)新互聯(lián)已為近1000家的企業(yè)提供了網(wǎng)站建設(shè)、域名、虛擬主機(jī)、網(wǎng)站改版維護(hù)、企業(yè)網(wǎng)站設(shè)計、福鼎網(wǎng)站維護(hù)等服務(wù)，公司將堅持客戶導(dǎo)向、應(yīng)用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

2.3.0+ 新增

在有些情況下，我們可能需要對一個 prop 進(jìn)行“雙向綁定”。不幸的是，真正的雙向綁定會帶來維護(hù)上的問題，因為子組件可以修改父組件，且在父組件和子組件都沒有明顯的改動來源。

這也是為什么我們推薦以 update:my-prop-name 的模式觸發(fā)事件取而代之。舉個例子，在一個包含  title prop 的假設(shè)的組件中，我們可以用以下方法表達(dá)對其賦新值的意圖：

this.$emit('update:title', newTitle)

然后父組件可以監(jiān)聽那個事件并根據(jù)需要更新一個本地的數(shù)據(jù)屬性。例如：

為了方便起見，我們?yōu)檫@種模式提供一個縮寫，即 .sync 修飾符：

當(dāng)我們用一個對象同時設(shè)置多個 prop 的時候，也可以將這個 .sync 修飾符和  v-bind 配合使用：

這樣會把 doc 對象中的每一個屬性 (如  title ) 都作為一個獨(dú)立的 prop 傳進(jìn)去，然后各自添加用于更新的  v-on 監(jiān)聽器。

以下為代碼實例

father.vue

child.vue

那這個修飾符的原理是什么呢？其實還是vue父組件可以監(jiān)聽子組件的事件，自組件可以觸發(fā)父組件的事件

father.vue

child.vue

在沒有sync的時候，我們要實現(xiàn)雙向綁定，可能需要在父組件里綁定一個事件和一個值

father.vue

child.vue

但是有了sync之后，我們就可以這么寫

father.vue

child.vue

父組件中的子組件，少寫了一個自定義事件屬性，子組件中$emit直接出發(fā)父組件中數(shù)據(jù)的更新，清新明了。使用中需要注意的是，update和后面對應(yīng)的數(shù)據(jù)名不能寫錯。

父子組件的雙向數(shù)據(jù)綁定

父組件改變數(shù)據(jù)可以改變子組件, 但是子組件的內(nèi)容改變并不會影響到父組件

可以通過2.3.0新增的sync修飾符來達(dá)到雙向綁定的效果

father.vue

box.vue

利用了父級可以在子元素上監(jiān)聽子元素的事件

father.vue

box.vue

總結(jié)

以上所述是小編給大家介紹的vue .sync修飾符的使用，希望對大家有所幫助，如果大家有任何疑問請給我留言，小編會及時回復(fù)大家的。在此也非常感謝大家對創(chuàng)新互聯(lián)網(wǎng)站的支持！