如何获取活动按钮 ref 属性并将其分配给 vue.js 中的变量答案

【问题标题】：How to get active buttons ref attribute and assign it to a variable in vue.js如何获取活动按钮 ref 属性并将其分配给 vue.js 中的变量
【发布时间】：2020-06-18 14:13:19
【问题描述】：

我有一个有 4 个按钮的页面：

<button ref='butOne' @click="saveRef">One</button>
<button ref='butTwo' @click="saveRef">Two</button>
<button ref='butThree' @click="saveRef">Three</button>
<button ref='butFour' @click="saveRef">Four</button>

我希望saveRef() 函数将按下的按钮的引用保存到像reference 这样的变量中。函数会是什么样子？

data: function(){
    return {
        reference:""
    }
},

methods:{
    saveRef(){
        // what should go here?
    }
}

【问题讨论】：

你试过我的答案了吗？
是的，我将其标记为正确 :)

标签： javascript jquery vue.js reference ref

【解决方案1】：

您可以将引用按钮的名称作为saveRef 方法的参数传递，如下所示：

<button ref='butOne' @click="saveRef('butOne')">One</button>

在方法代码中：

methods:{
    saveRef(btn){
         this.reference=this.$refs[btn] // reference the button element which name passed as parameter
    }
}

【讨论】：