vuejs2 - 如何在 vue.js 中从子组件向父组件发出带有 id 的函数

Question

我有一个卡片组件和一个房子组件。我想从子组件向父组件发出函数以及 id。我想从内部组件的卡组件调用编辑函数。卡片.vue

  <tr class="registrationtable" v-for="valueList in values" v-bind:key="valueList">
              <td class="registrationtable" v-for="head in columnHeader" v-bind:key="head">
                <span v-if="href.includes(head)">
                  {{ head }}
                  <a
                    v-for="action in actionList"
                    v-bind:key="action"
                    v-on:click="methodToCall(valueList[head])"
                    >{{ action }}</a
                  ></span
                >

                <span v-else></span>
              </td>
            </tr>

  created() {
    this.methodToCall(id); 
  },

房子.vue

<card :method-to-call="editFunction" />

标签： vuejs2

Answer 1

您可以使用this.$emit()

card.vue 模板

<tr class="registrationtable" v-for="valueList in values" v-bind:key="valueList">
              <td class="registrationtable" v-for="head in columnHeader" v-bind:key="head">
                <span v-if="href.includes(head)">
                  {{ head }}
                  <a
                    v-for="action in actionList"
                    v-bind:key="action"
                    v-on:click="methodToCall(valueList[head])"
                    >{{ action }}</a
                  ></span
                >

                <span v-else></span>
              </td>
            </tr>

卡片.vue

methods:{
methodToCall:function(id){
     this.$emit('methodToCall', id)
}
}

房子.vue

<card :method-to-call="editFunction" />