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

【vue】v-model在表单元素上的应用

表单元素:

https://blog.csdn.net/m0_67930426/article/details/134655644

使用模板

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>


<body>

<!--准备容器  -->
<div id="app">
    <h3>自我介绍</h3>
    姓名: <input type >
    <br><br>
    性别:
    <input type="radio" >男
    <input type="radio" >女
    <br><br>
    所在地区:
    <select>
        <option>北京</option>
        <option>天津</option>
        <option>上海</option>
        <option>南京</option>
    </select>
    <br><br>
    简介:
    <textarea></textarea>
    <br><br>
    <input type="submit" value="提交">
    <br><br><br>
    <input type="checkbox">
    <label >同意xxxxxxxxxx</label>
</div>

<!-- 引包 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.7.14/dist/vue.js"></script>

<!-- 创建实例 -->
<script>

    var  app=new Vue({
        el:'#app',
        data: {

        }
    });
</script>
</body>
</html>

目录

v-model绑定输入框

v-model绑定单选框

v-model绑定下拉框

v-model绑定文本域

v-model绑定复选框


 

v-model绑定输入框

  

v-model绑定单选框

 

 

v-model绑定下拉框

v-model绑定文本域

 

v-model绑定复选框

也可以打开控制台,找到vue插件,在上面做数据处理


http://www.kler.cn/news/149198.html

相关文章:

  • 代码随想录-刷题第十一天
  • CSS-常见元素显示模式总结
  • [Android]常见的数据传递方式
  • Spark---资源、任务调度
  • 【Linux下基本指令——(1)】
  • 【C 语言经典100例】C 练习实例13 - 水仙花数
  • python基础练习题库实验6
  • Vue3-toRaw 和 markRaw 函数
  • js相同字符串截取拼接
  • 牛客剑指offer刷题位运算篇
  • 八股文-如何理解Java中的多态
  • 管理后台系统,springboot+redis+nginx+html+bootstrap
  • UE5 中的computer shader使用
  • C++ 背包理论基础01 + 滚动数组
  • 【MySql】14- 实践篇(十二)-grant权限/分区表/自增Id用完怎么办
  • HassOS使用nmcli设置静态IPv4地址及网关、DNS
  • 对支付宝进行测试用例分析
  • .sketch的文件转.psd文件
  • Linux僵死进程及文件操作
  • 【ARM CoreLink 系列 8 -- SMMU 详细介绍-上半部】
  • 《微信小程序开发从入门到实战》学习三十六
  • springboot实战之stream API应用过滤不符合条件的数据
  • MySQL巧用公用表表达式(CTE)处理递归查询
  • 想学计算机视觉入门的可以看过来了
  • 牛客算法题 HJ100 等差数列 golang语言实现
  • QT配合CSS隐藏按钮
  • Springboot_文件下载功能(前端后端)
  • Kotlin学习——kt入门合集博客 kt里的委派模式Delegation kt里的特性
  • 基于C#实现Dijkstra算法
  • Java架构师软件架构开发