技術標籤：技術成長軌跡

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();
    }
}