基于vue.js中关于下拉框的值默认及绑定问题


Posted in Javascript onAugust 22, 2018

一、今天遇到vue中下拉框问题,故而写点东西留个脚印

<template>

 <select v-model='selected' @click="disable()">
 <option v-for="(option,index) in options" v-bind:value="option.value" :disabled="option.disabled">
  {{ option.text }}{{index}}{{option.disabled}}
 </option>
 </select>
 <span>Selected: {{ selected }}</span>
</template>
<script>
 export default{
 name: 'second',
 data(){
  return {
  selected: 'sex', // 这里选择默认项
  options: [
   {text: '点击选择性别', value: 'sex', disabled: ''},
   {text: '男', value: '1'},
   {text: '女', value: '2'}
  ]
  }
 },
 methods: {
  disable: function () {
  this.options[0].disabled = disabled;
  },
 }
 }
</script>

以上这篇基于vue.js中关于下拉框的值默认及绑定问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javaScript对象和属性的创建方法
Jan 15 Javascript
利用javascript实现全部删或清空所选的操作
May 27 Javascript
Javascript基础教程之数据类型 (字符串 String)
Jan 18 Javascript
JavaScript中length属性的使用方法
Jun 05 Javascript
jQuery中extend函数详解
Jul 13 Javascript
基于BootStrap Metronic开发框架经验小结【一】框架总览及菜单模块的处理
May 12 Javascript
值得分享的轻量级Bootstrap Table表格插件
May 30 Javascript
解决OneThink中无法异步提交kindeditor文本框中修改后的内容方法
May 05 Javascript
React服务端渲染(总结)
Jul 01 Javascript
Mongoose中document与object的区别示例详解
Sep 18 Javascript
浅谈vue项目4rs vue-router上线后history模式遇到的坑
Sep 27 Javascript
Node绑定全局TraceID的实现方法
Nov 14 Javascript
微信小程序有旋转动画效果的音乐组件实例代码
Aug 22 #Javascript
vue2.0 下拉框默认标题设置方法
Aug 22 #Javascript
VUE中v-on:click事件中获取当前dom元素的代码
Aug 22 #Javascript
jquery获取select选中值的文本,并赋值给另一个输入框的方法
Aug 21 #jQuery
js动态设置select下拉菜单的默认选中项实例
Aug 21 #Javascript
Canvas实现微信红包照片效果
Aug 21 #Javascript
Vue开发实现吸顶效果的示例代码
Aug 21 #Javascript
You might like
PHP的FTP学习(四)
2006/10/09 PHP
php中AES加密解密的例子小结
2014/02/18 PHP
windows中为php安装mongodb与memcache
2015/01/06 PHP
Yii2实现跨mysql数据库关联查询排序功能代码
2017/02/10 PHP
php通过header发送自定义数据方法
2018/01/18 PHP
PHP获取本周所有日期或者最近七天所有日期的方法
2018/06/20 PHP
jquery 插件学习(一)
2012/08/06 Javascript
jquery struts 验证唯一标识(公用方法)
2013/03/27 Javascript
jQuery判断密码强度实现思路及代码
2013/04/24 Javascript
javascript禁制后退键(Backspace)实例代码
2013/11/15 Javascript
js模拟点击以提交表单为例兼容主流浏览器
2013/11/29 Javascript
Angularjs实现分页和分页算法的示例代码
2016/12/23 Javascript
bootstrap+jQuery实现的动态进度条功能示例
2017/05/25 jQuery
使用Webpack提高Vue.js应用的方式汇总(四种)
2017/07/10 Javascript
javascript帧动画(实例讲解)
2017/09/02 Javascript
JS 实现获取验证码 倒计时功能
2018/10/29 Javascript
详解微信小程序scroll-view横向滚动的实践踩坑及隐藏其滚动条的实现
2019/03/14 Javascript
Vue组件通信的几种实现方法
2019/04/25 Javascript
javascript操作元素的常见方法小结
2019/11/13 Javascript
JS Web Flex弹性盒子模型代码实例
2020/03/10 Javascript
JavaScript隐式类型转换代码实例
2020/05/29 Javascript
在vue中使用防抖函数组件操作
2020/07/26 Javascript
简单实现Python爬取网络图片
2018/04/01 Python
python实现大学人员管理系统
2019/10/25 Python
Python插入Elasticsearch操作方法解析
2020/01/19 Python
Spring @Enable模块驱动原理及使用实例
2020/06/23 Python
解决Python安装cryptography报错问题
2020/09/03 Python
Python实现疫情地图可视化
2021/02/05 Python
英国探险旅游专家:Explore
2018/12/20 全球购物
远程学习的教学用品和家庭学习资源:Really Good Stuff
2020/04/27 全球购物
一套带网友答案的.NET笔试题
2016/12/06 面试题
护士节策划方案
2014/05/19 职场文书
八一建军节主持词
2015/07/01 职场文书
2015年教师节主持词
2015/07/03 职场文书
2016年七夕爱情寄语
2015/12/04 职场文书
Win11怎么进入安全模式?Windows 11进入安全模式的方法
2021/11/21 数码科技