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

Question

我有一个包含 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?
    }
}

Answer 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
    }
}

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

How to get active buttons ref attribute and assign it to a variable in vue.js

javascript

jquery

reference

ref

vue.js