.sync的一个用法

面试时,有人问了我修饰符是什么,就是一个点后面加一个单词,我当时还以为是什么文件夹后缀呢。很是尴尬

这里主要学习下.sync的一个用法
假设下场景:

这里有一个父组件,父组件中有个money,需要传到子组件中,但是我子组件又想改变这个值,该怎么做呢,直接在方法中改值肯定是错的,必须传递一个方法和值到父组件中才行。

但是这样就必须在父组件中再注册一个方法,这样就有点麻烦了,所以就用到了sync

原始比较繁琐的方式

父组件

<HelloWorld :money=money @update:money = "fn"></HelloWorld>

money: 200
fn(val){
       this.money = val
     }

子组件

<span>money----->{{money}} <button @click="handleMoney">点击钱变多</button></span>

props:{
    money: null
  }
handleMoney () {
       this.$emit('update:money',400)
     }

而用了sync后,父组件就简单多了
直接一步到位,也不用去写什么fn方法

<HelloWorld :money.sync=money></HelloWorld>
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章