当前位置: 首页 > news >正文

vue语法v-model例子单选题和多选题

<template>
        <!-- 单选框 -->
         <input type="radio" v-model="danxuan" value="a">
         <label for="a">a</label>
         <input type="radio" v-model="danxuan" value="b">
         <label for="b">b</label>
         <input type="radio" v-model="danxuan" value="c">
         <label for="c">c</label>
         "单选"   {{danxuan}}

         <!-- 复选框 -->
          <input type="checkbox" v-model="fuxuan" value="A">
          <label for="one">one</label>
          <input type="checkbox" v-model="fuxuan" value="B">
          <label for="two">two</label>
          <input type="checkbox" v-model="fuxuan" value="C">
          <label for="three">three</label>
          "复选" {{   fuxuan}}

          <!-- 下拉菜单 -->
           <select name="" id="" v-model="xiala">
            <option  >篮球</option>
            <option>足球</option>
            <option>排球</option>
          
           </select>
           选择为:{{xiala}}
</template>

    
<script >
    export default{
        data() {
            return {
                // 单选框选中时比如第一个, value值赋值给danxuan[]
                fuxuan:[], 
                danxuan:[], 
                xiala:"", 
            }
        },

        methods:{

        }, 

        mounted(){

        },
    }
</script>
    
<style lang="css">
    
</style>

在这里插入图片描述

http://www.dtcms.com/a/35744.html

相关文章:

  • 【每日德语】Reise — 旅行
  • 湖北中医药大学谱度众合(武汉)生命科技有限公司研究生工作站揭牌
  • vue2项目中初始化mapbox组件
  • 免费 MLOps 课程:学习机器学习运维的完整流程
  • 玩转Docker | 使用Docker搭建Vikunja任务管理应用
  • 浏览器JS打不上断点,一点就跳到其他文件里。浏览器控制台 js打断点,指定的位置打不上断点,一打就跳到其他地方了。
  • HarmonyOS Next 实现登录注册页面(ARKTS) 并使用Springboot作为后端提供接口
  • Spring Boot集成Swagger API文档:傻瓜式零基础教程
  • unity学习52:UI的最基础组件 rect transform,锚点anchor,支点/轴心点 pivot
  • 首次使用WordPress建站的经验分享(一)
  • Json和JsonString之间互转总结
  • Debezium日常分享系列之:Debezium 3.1.0.Alpha2发布
  • 【AI时代】可视化训练模型工具LLaMA-Factory安装与使用
  • 诺依框架安装
  • mysql索引
  • API测试工具:Swagger vs Postman 2025最新全面对比
  • faster rcnn FPN损失项
  • 大模型架构与训练方向
  • CSS滚动条原理与自定义样式指南,CSS滚动条样式失效,滚动条样式无效,-webkit-scrollbar无效,overflow不显示滚动条
  • MongoDB#Code和Function
  • 华三交换机S5560 NQA测试
  • vscode如何使用鼠标滚轮调整字体大小
  • 3D Web轻量化引擎HOOPS Communicator如何赋能航空航天制造?
  • 图神经网络实战(24)——基于LightGCN构建推荐系统
  • PostgreSQL 支持字段类型
  • Windows 11【1001问】Windows 11系统硬件配置要求
  • 特辣的海藻!3
  • C# winfrom 修改系统快捷键 提高效率 把难按的快捷 换成容易按的快捷键 减轻工作难度
  • 【初探数据结构】时间复杂度和空间复杂度
  • 3. Spring Cloud LoadBalancer 入门与使用