【vue】动态绑定ref父组件调用子组件方法

目录

静态绑定

动态绑定

---

静态绑定

父组件 

<input-number ref="rightSide_inpunumber" ></input-number>

子组件

  methods: {
    buttonMouseup() {
        //....省略
    },
}

父组件获取子组件，调用子组件方法

this.$refs.rightSide_inpunumber.buttonMouseup();

 

动态绑定

父组件 

<element-item :ref="'elementItem_'+item.id" > </element-item>

子组件

  methods: {
    handleClickIcon: function () {
        console.log('hi icon');
    }
}

父组件获取子组件，调用子组件方法

this.$refs[`elementItem_${item.id}`].handleClickIcon();

参考自 vue的动态绑定ref获取子组件的数据