vuejs radio button component

Question

I trying to make this custom radio button component to work in vuejs. How do I make the radio button checked with a value from parent component. I know you use v-model and s

Answer 1

I'd personally do it another way, to keep a v-model directive and avoid an @change event (which could be replaced by @input if any other logic has to be performed). The thing here is that I the v-model value is equal to the "value" props in the radio-button component.

props: {
    value: {},
    v_value: {},
    ....
}

So all you have to do is pass the real current value to make some checks and $emit the value on click on a label, or on change on the input if you don't have any label.

       {{ label }}

I also added (but commented it) a version with simple html markup in case you want custom-looking radio buttons :

      {{ label }}

https://jsfiddle.net/Zyfraglover/ndcp8t6e/