vue父子组件的的通信问题总结

写了一段时间的vue发现其最大的好处就是觉得一起

1.父组件传递数据给子组件（数据绑定）

• 父组件向子组件属性注入数据

<template>
//使用子组件,绑定子组件的属性为message（子组件将通过获取属性数据获取父组件传输的值）
  <edit :editMessage="message"><edit>
</template>
<script>
//引入组件
import Edit from "./edit";
export default {
  name: "userSetting",
  //声明组件
  components: { Edit },
  data() {
    return {
      message:{
              name :'pam',
              age :22
          }
    };
  },
  methods: {}
};

• 子组件展示数据

<template>
  <div>
  <title>名字：{
  {editMessage.name}}</title>
  <p>年龄{
  {editMessage.age}}</p>
  </div>
</template>
<script>
export default {
//获取属性数据(改属性可以可以直接通过 this.editMessage获取数据)
  props: ["editMessage"],
  data() {
    return {};
  },
 
};
</script>