这篇文章主要介绍了Vue表单之v-model绑定下拉列表功能，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值,需要的朋友可以参考下
vue要绑定下拉列表会稍微有点不同。
因为下拉列表不是一个标签能搞掂的。
原生的html写法如下
Vue.jsReact.jsAngular.js
和 。
在Vue中要绑定，需要把 v-model 写在 select 标签里。
代码如下
<div id="app"> {{curriculum}}<span>{{selectCurriculums}}</span></div> export default { name: 'app', data () { return { selectCurriculums: 'React.js', curriculums: ['Vue.js', 'React.js', 'Angular.js'] } } }
curriculums 是初始化数组，提供值给 option 。
selectCurriculums 提供了一个初始值。
每当选中一个 ，就会对应的更新 selectCurriculums 的数据。
总结
以上所述是小编给大家介绍的Vue表单之v-model绑定下拉列表,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！
如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！
您可能感兴趣的文章:
- vue动态绑定组件子父组件多表单验证功能的实现代码
- vue2.0数据双向绑定与表单bootstrap+vue组件
- 详细分析vue表单数据的绑定
- Vue表单控件数据绑定方法详解
- Vue表单绑定的实例代码（单选按钮,选择框（单选时,多选时,用 v-for 渲染的动态选项）
- vue 表单之通过v-model绑定单选按钮radio
- Vuejs学习笔记之使用指令v-model完成表单的数据双向绑定
- vue指令之表单控件绑定v-model v-mod本文来源gao.dai.ma.com搞@代*码#网el与v-bind结合使用
- vue.js使用v-model实现表单元素(input) 双向数据绑定功能示例
- 详解vue 表单绑定与组件
以上就是Vue表单之v-model绑定下拉列表功能的详细内容，更多请关注gaodaima搞代码网其它相关文章！
搞代码网（gaodaima.com）提供的所有资源部分来自互联网，如果有侵犯您的版权或其他权益，请说明详细缘由并提供版权或权益证明然后发送到邮箱[email protected]，我们会在看到邮件的第一时间内为您处理，或直接联系QQ：872152909。本网站采用BY-NC-SA协议进行授权
转载请注明原文链接：Vue表单之v-model绑定下拉列表功能
转载请注明原文链接：Vue表单之v-model绑定下拉列表功能
