javascript - Getting dynamic $refs value in Vue2 - Stack Overflow

admin管理员组

文章数量:1243198

I'm working on a vue application. I have dynamic ref binding for input elements that accept quantity Something like this -

:ref="'qty' + index"

When I log this.$refs, I get all the refs. qty0, qty1, qty2 and so on.

My question is, how do I get the value of a particular input element using the ref?

I cannot hardcode this.$refs.qty0 as the index keeps changing.

I tried

let quantityRef = 'qty' + index;
console.log(index); // 0
console.log(quantityRef); // qty0
console.log(this.$refs.quantityRef); // undefined

Thanks in advance

I'm working on a vue application. I have dynamic ref binding for input elements that accept quantity Something like this -

:ref="'qty' + index"

When I log this.$refs, I get all the refs. qty0, qty1, qty2 and so on.

My question is, how do I get the value of a particular input element using the ref?

I cannot hardcode this.$refs.qty0 as the index keeps changing.

I tried

let quantityRef = 'qty' + index;
console.log(index); // 0
console.log(quantityRef); // qty0
console.log(this.$refs.quantityRef); // undefined

Thanks in advance

• javascript
• vue.js
• vuejs2

Share Improve this question Follow edited Mar 16, 2022 at 12:55 Penny Liu 17.4k55 gold badges8686 silver badges108108 bronze badges asked Jan 26, 2018 at 0:54 VishwasVishwas 1,49888 gold badges2222 silver badges3434 bronze badges 1

• Thanks, this helped me to find the doc. Just sharing this back for others. ponents-edge-cases – marlo Commented Oct 1, 2020 at 1:57

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 16

Use a string key directly, with brackets:

this.$refs['qty' + index]

本文标签： javascriptGetting dynamic refs value in Vue2Stack Overflow