vue 父子组件

版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/u013022210/article/details/88635585

1.引入子组件

2. 父组件给子组件传值

父组件给子组件传值:

1.父组件调用子组件的时候,绑定动态属性

<v-header :title='title'></v-header>

2.在子组件里面通过props 接收父组件传过来的数据 

3.注意子组件和父组件传到子组件的属性重复则显示为父组件信息

4.父组件中传值方法到子组件

//父组件传方法  js 中methods中存在run方法

<v-header :run="run" :home="this"></v-header>//run中不能打括号,打括号表示运行



//子组件接收props:['run']

运行 this.run() 即可



//子组件也可以通过方法回调的形式 传数据给父组件

==>例子:

 子组件接收 data平级的 添加 props:['title'] 

扫描二维码关注公众号,回复: 5574035 查看本文章

3.子组件给父组件传值

==>方法回调的形式传给父组件

4.父组件给子组件传值验证数据合法性

  props: {
    // 检测类型
    height: Number,
    // 检测类型 + 其他验证
    age: {
      type: Number,
      default: 0,
      required: true,
      validator: function (value) {
        return value >= 0
      }
    }
  }

猜你喜欢

转载自blog.csdn.net/u013022210/article/details/88635585
今日推荐