Version

3.0.3

Reproduction link

https://codesandbox.io/s/hopeful-zhukovsky-yuxqi?file=/src/App.vue

Steps to reproduce

<template>
  <label>model {{model}}</label>
  <input type="checkbox" v-model="model" :true-value="false" :false-value="true" />
</template>

<script>
import {ref} from 'vue'
export default {
  name: 'App',
  setup(){
    const model=ref(false)
    return {
      model
    }
  }
}
</script>

What is expected?

checkbox expected to be checked since model is false and true-value="false"

What is actually happening?

checkbox is not checked on first render

After you click it once, it actually works okay.

I opened a PR,but I found that true-value and false-value are also not supported when v-model value is a Set or an Array.Is it designed like this?

@edison1105 yes, that's normal. With sets and arrays, there should be a value attribute instead

@edison1105 yes, that's normal. With sets and arrays, there should be a value attribute instead

Got it,Thanks~

Hi @posva I think this is not about inverted value. see https://codesandbox.io/s/fast-worker-k8q0e?file=/src/App.vue I modified the code to see the problem more clearly.

Because true-value or false-value is not assigned to the checkbox after first rendered.

I think https://github.com/vuejs/vue-next/commit/48f00c0f1b574a235be40c560d2cf373be97615e is not fix this bug.

We should assign true-value or false-value to checkbox but setChecked is not do this after first render.

<div id="app">
  <label>model {{ model }}</label>
  <input type="checkbox" v-model="model" :true-value="11" :false-value="22" />
</div>

<script>
  const { ref,createApp } = Vue
  createApp({
    name: "App",
    setup() {
      const model = ref(false);
      return {
        model,
      };
    },
  }).mount('#app')
</script>

After first render,the model value is still false not 22.

And my PR is make it works fine.

Hi @posva @yyx990803 I update demo https://codesandbox.io/s/fast-worker-k8q0e?file=/src/App.vue with lastest vue-next version 3.0.4. This bug still happens.I think the model value should be 22 on initial render.

model should be the source of truth, not the template. If the user intends to provide an initial value that is neither true-value or false-value, the value should be left untouched.

This actually has nothing to do with true/false-value. e.g. if you have <input type="checkbox" v-model="model"> but model's initial value is 123, it will not be changed to false.

model should be the source of truth, not the template. If the user intends to provide an initial value that is neither true-value or false-value, the value should be left untouched.

This actually has nothing to do with true/false-value. e.g. if you have <input type="checkbox" v-model="model"> but model's initial value is 123, it will not be changed to false.

OK