Vue表单实例代码
更新时间：2016年09月05日 16:48:13 作者：Sunshine_lily
Vue.js 是用于构建交互式的 Web 界面的库。这篇文章主要介绍了Vue表单实例代码的相关资料,非常不错，具有参考借鉴价值，需要的朋友可以参考下
什么是 Vue.js？
Vue.js 是用于构建交互式的 Web 界面的库。
Vue.js 提供了 MVVM 数据绑定和一个可组合的组件系统，具有简单、灵活的 API。
Vue.js 特点
简洁： HTML 模板 + JSON 数据，再创建一个 Vue 实例，就这么简单。
数据驱动： 自动追踪依赖的模板表达式和计算属性。
组件化： 用解耦、可复用的组件来构造界面。
轻量： ~24kb min+gzip，无依赖。
快速： 精确有效的异步批量 DOM 更新。
模块友好： 通过 NPM 或 Bower 安装，无缝融入你的工作流。
gitHub地址:https://github.com/lily1010/vue_learn/tree/master/lesson11
一 vue表单
实在是太简单了,直接来个例子
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Vue表单</title>
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="test">
<!--输入框-->
<input type="text" v-model="msg"> <br />
<!--单选框-->
<input id="mycb1" type="radio" v-model="choose1">
<label for="mycb1">{{choose1}}</label>
<!--复选框-->
<input id="mycb2" type="checkbox" v-model="choose2">
<label for="mycb2">{{choose2}}</label>
<!--Select-->
<select v-model="selected">
<option>A</option>
<option>B</option>
<option>C</option>
</select>
<span>选中: {{ selected }}</span>
</div>
<script type="text/javascript">
var vm = new Vue({
el: ".test",
data: {
msg: '我是文本',
choose1: false,
choose2: false,
selected:''
}
})
</script>
</body>
</html>
以上所述是小编给大家介绍的Vue表单实例代码，希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
相关文章
这篇文章主要为大家详细介绍了vue+canvas绘制时间轴的方法，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-08-08
解决vue项目运行出现warnings potentially fixable with the `--fix
这篇文章主要介绍了解决vue项目运行出现warnings potentially fixable with the `--fix` option的报错问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2021-11-11
这篇文章主要介绍了element-ui查看大图的方法示例，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-12-12
本篇文章主要介绍了深入理解vue Render函数，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-07-07
本篇文章主要介绍了vue-router history模式下的微信分享小结，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-07-07
本篇文章主要介绍了vue.js国际化 vue-i18n插件的使用详解，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-07-07
这篇文章主要为大家详细介绍了vue实现滚动条始终悬浮在页面最下方，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-04-04
这篇文章主要给大家介绍了关于在vue中如何使用node.js的相关资料,vue和nodejs经常让新手们感到困惑,文中通过实例代码介绍的非常详细,需要的朋友可以参考下2023-07-07
这篇文章主要介绍了详解基于vue-cli3.0如何构建功能完善的前端架子，本文整合出具备基础功能的前端架子，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-10-10
这篇文章主要给大家介绍的是vue2 vue3中使用Echarts的相关资料，下面文章 会详细介绍该内容，感兴趣的小伙伴不要错过哟2021-09-09
最新评论