首先看到 .sync 我們需要知道這是個(gè)修飾器 類似修飾器還有 .stop .prevent 之類

　　其實(shí)這個(gè)修飾符就是vue封裝了 子組件要修改父組件傳過來的動(dòng)態(tài)值的語法糖，省去了父組件需要寫的方法，但是子組件emit時(shí)要加上update

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

　　代碼解釋

　　// 這里父組件，要給子組件傳一個(gè)title的值

<template>

    <div>  

        <t-title :title.sync="fatherTitle"></t-title>

    </div>

</template>

<script>

import tTitle from './blocks/list';

export default {

    name: 'test1',

    components: {  tTitle },

    data() {

        return {

            fatherTitle: '父組件給的標(biāo)題'

        };

    },

}

</script>

// 子組件

<template>

    <div>

        <h3>{{ title }}</h3>

        <button @click="changeTitle">改變</button>

    </div>

</template>

<script>

export default {

    props:{

        title: {type: String, default: '默認(rèn)值11'}

    },

    methods: {

        changeTitle() {

            this.$emit("update:title", "子組件要改自己的標(biāo)題");

        }

    }

};

</script>

　　這里關(guān)鍵就是emit里的參數(shù)要寫成'update'+ ':' +'要修改的props'

　　以前是用的this.$emit("自定義方法")

　　更多關(guān)于“前端培訓(xùn)”的問題，歡迎咨詢千鋒教育在線名師。千鋒已有十余年的培訓(xùn)經(jīng)驗(yàn)，課程大綱更科學(xué)更專業(yè)，有針對(duì)零基礎(chǔ)的就業(yè)班，有針對(duì)想提升技術(shù)的好程序員班，高品質(zhì)課程助力你實(shí)現(xiàn)程序員夢(mèng)想。