组件之间数据同步

数据同步的核心：父组件给子组件传递引用数据类型的数据

父组件:

<template>
        <div>
              <h1>父组件 {{msg.name}}</h1>
              <children :n="msg"></children>
        </div>
</template>
<script>
export default {
  data() {
    return {
      msg:{name:'hahah'} // 引用数据类型
    }
  }
}
</script>

子组件:

<template>
      <div>
            <h2 @click="sync">子组件 {{n.name}}</h2>
      </div>
</template>
<script>
export default {
  props: {n:Object},
  methods: {
    sync() {
      this.n.name = 'changed'
    }
  }
}
</script>