Making dynamic value bindings

In our example app in the previous section, we either get strings or Boolean values for the radio, checkbox, and select options by using v-model alone. We can change this default value by using true-value, false-value, and v-bind. Let's dive in.

Replacing Boolean – checkbox elements

We can bind our custom value to the single checkbox elements by using true-value and false-value. For example, we can bind the yes value to replace the default true Boolean value with true-value and no to replace the default false Boolean value with false-value:

// src/components/dynamic-values.vue
<input
  type="checkbox"
  v-model="form.subscribe"
  true-value="yes"
  false-value="no"
>

export default {
  data () {
    return {
      form: { subscribe: 'no' }
    }
  },
  methods:{
    checkForm (e) {
      this.errors = []
      if (this.form.subscribe !== 'yes') {
        this.errors.push('Subscription required...