Use parameters in function as key

Question

Hi anyone gives me some ideas to use the parameters as key in function?

for example, i am using vue, and have set html

<div id="app">
  <input ref="name" />
  <button @click="focusIt('name')">
    Click me
  </button>
</div>

and javascript code

new Vue({
    el: "#app",
  methods: {
    focusIt(value) {
        this.$refs.name.focus();
    }
  }
})

I have passed name as a parameter in the focusIt function, is there any way to use it inside the function as a key? something like this.$refs.name.focus()?

I have made a jsfiddle

Thanks for any advice!

Update:

I tried the this.$refs[value].focus(), but it does not work jsfiddle

Your fiddle works as expected (didn't you forget to choose Vue in list of frameworks?). What is the problem? — vladkras, Feb 22 '18 at 04:13
@ArunPJohny it is not working, you can try with the jsfiddle i gave. — James Chen, Feb 22 '18 at 04:25
@JamesChen https://jsfiddle.net/nnf4p1sw/16/ - you need to add vue library reference — Arun P Johny, Feb 22 '18 at 04:27
@ArunPJohny I tried this way before! Did not know why it was not working at that time, and now it works... Thanks anyway — James Chen, Feb 22 '18 at 04:30

score 0 · Accepted Answer · answered Feb 22 '18 at 04:14

0

If you want to pass down the name of the ref:

new Vue({
    el: "#app",
    methods: {
    focusIt(value) {
        this.$refs[value].focus();
    }
  }
})

answered Feb 22 '18 at 04:14

Aydin4ik

1,782
1
14
19

Use parameters in function as key

1 Answers1