Vue—父向子传值

1、父组件向子组件传值

1.1父组件

1.在父组件中引入子组件（调用）
import rulesMain from "../view/rules/rulesmain"; //引入规则流页面（子组件）

2.在父组件的data中定义值（注册）
 data: function() {
    return {
      editDataList: []
    };
 }
 
3.向editDataList中放值（放值）
editData(ruleId, ruleName, ruleMessage) {
      this.ruleId = ruleId;
      this.ruleName = ruleName;
      this.ruleMessage = ruleMessage;
      this.editDataList.push(this.ruleId);
      this.editDataList.push(this.ruleName);
      this.editDataList.push(this.ruleMessage);
}

4.在子组件上绑定要传给子组件的值（引用）
<rulesMain v-bind:editDataList="editDataList" />

1.2子组件—接收父组件传过来的值

1.用props来接收父组件传来的值
 props: {
    editDataList: {
      type: Array,
      required: true
    }
 }
 
2.此时在子组件中就可以使用父组件传来的值了（哪里需要哪里调用就可以了）
watch: {
    editDataList(){
      this.ruleName = this.editDataList[1];
      this.ruleNote = this.editDataList[2];
      this.queryRuleByRuleId();
    }
}