【Vue】双向绑定 v-model

html 复制代码
<script setup>
  import { reactive,ref} from 'vue' 
  let hbs = ref([]); //装爱好的值
</script>

<template>
  <div>
    吃 <input type="checkbox" name="hbs" v-model="hbs" value="吃"> 
    喝 <input type="checkbox" name="hbs" v-model="hbs" value="喝">
    玩 <input type="checkbox" name="hbs" v-model="hbs" value="玩">
    乐 <input type="checkbox" name="hbs" v-model="hbs" value="乐">
    <br>
    {{ hbs }}
  </div>
</template> 

<style scoped>

</style>
相关推荐
Irene19913 分钟前
JavaScript中,为什么需要手动清理事件
javascript·手动清理事件监听器
摘星编程6 分钟前
OpenHarmony环境下React Native:Zustand持久化存储
javascript·react native·react.js
2501_944521599 分钟前
Flutter for OpenHarmony 微动漫App实战:图片加载实现
android·开发语言·前端·javascript·flutter·php
摘星编程12 分钟前
在OpenHarmony上用React Native:Recoil选择器异步数据
javascript·react native·react.js
雨中深巷的油纸伞23 分钟前
vue 项目部署到iis后 浏览器刷新404
前端·javascript·vue.js
谢尔登1 小时前
从源码视角来看Pinia!
前端·javascript·vue.js
梦6501 小时前
JavaScript 循环
开发语言·javascript·ecmascript
运筹vivo@1 小时前
攻防世界: mfw
前端·web安全·php
沛沛老爹2 小时前
从Web到AI:行业专属Agent Skills生态系统技术演进实战
java·开发语言·前端·vue.js·人工智能·rag·企业转型