vue3 双向绑定 失效
错误方式(复选框与数组绑定)
<template>
<!-- 复选框?-->
<div>
<input type=checkbox id=jack value=Jack v-model=checkedNames.arr />
<label for=jack>Jack</label>
<input type=checkbox id=john value=John v-model=checkedNames.arr />
<label for=john>John</label>
<input type=checkbox id=mike value=Mike v-model=checkedNames.arr />
<label for=mike>Mike</label>
<br />
<span>Checked names: {{ checkedNames.arr}}</span>
</div>
</template>
<script setup>
import {reactive} from vue;
const checkedNames = reactive([])
</script>

正确方式
<template>
<!-- 复选框?-->
<div>
<input type=checkbox id=jack value=Jack v-model=checkedNames.arr/>
<label for=jack>Jack</label>
<input type=checkbox id=john value=John v-model=checkedNames.arr/>
<label for=john>John</label>
<input type=checkbox id=mike value=Mike v-model=checkedNames.arr/>
<label for=mike>Mike</label>
<br/>
<span>Checked names: {{ checkedNames.arr }}</span>
</div>
</template>
<script setup>
import {reactive} from vue;
const checkedNames = reactive({
arr:[]
})
</script>
<style scoped>
</style>

TRANSLATE with