How can I get the value of a radio input and pass it to a function using @click in Vue.js. I actually want to do something like this:

<input type="radio" name="phone" :value="mobile.value" @click = "setPrice(value)">

What is the right syntax?

How can I get the value of a radio input and pass it to a function using @click in Vue.js. I actually want to do something like this:

<input type="radio" name="phone" :value="mobile.value" @click = "setPrice(value)">

What is the right syntax?

• javascript
• vue.js
• vuejs2
• vue-directives

Share Improve this question Follow asked Apr 22, 2018 at 16:59 Dhiaa Eddin AnabtawiDhiaa Eddin Anabtawi 3911 silver badge88 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 3

For what your asking click here to see the answer

Checkout this straightforward example how input radio works with vue.js

<input type="radio" id="one" value="One" v-model="picked">
<label for="one">One</label>
<br>
<input type="radio" id="two" value="Two" v-model="picked">
<label for="two">Two</label>
<br>

and the script:

export default {
  data: {
    return {
      picked: 'One'
    }
  }
}

Just provide the function name:

@click="setPrice"

You should then have access to the value:

function setPrice(event) {
  const value = event.target.value;
}