基于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 相关文章推荐
JQuery插件Style定制化方法的分析与比较
May 03 Javascript
使用ImageMagick进行图片缩放、合成与裁剪(js+python)
Sep 16 Javascript
jquery默认校验规则整理
Mar 24 Javascript
一个简单的动态加载js和css的jquery代码
Sep 01 Javascript
完美兼容各大浏览器的jQuery仿新浪图文淡入淡出间歇滚动特效
Nov 12 Javascript
JavaScript用select实现日期控件
Jul 17 Javascript
第一篇初识bootstrap
Jun 21 Javascript
javascript定时器取消定时器及优化方法
Jul 08 Javascript
详解vue-cli构建项目反向代理配置
Sep 07 Javascript
微信小程序自定义多选事件的实现代码
May 17 Javascript
bootstrapTable+ajax加载数据 refresh更新数据
Aug 31 Javascript
Jquery 动态添加元素并添加点击事件实现过程解析
Oct 12 jQuery
微信小程序有旋转动画效果的音乐组件实例代码
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函数篇之掌握ord()与chr()函数应用
2011/12/05 PHP
解析php中curl_multi的应用
2013/07/17 PHP
Zend Framework分页类用法详解
2016/03/22 PHP
PHP中常用的数组操作方法笔记整理
2016/05/16 PHP
用PHP的socket实现客户端到服务端的通信实例详解
2017/02/04 PHP
小结Node.js中非阻塞IO和事件循环
2014/09/18 Javascript
jQuery中ready事件用法实例
2015/01/19 Javascript
text-align:justify实现文本两端对齐 兼容IE
2015/08/19 Javascript
CSS或者JS实现鼠标悬停显示另一元素
2016/01/22 Javascript
jQuery 出现Cannot read property ‘msie’ of undefined错误的解决方法
2016/11/23 Javascript
node.js发送邮件email的方法详解
2017/01/06 Javascript
原生js实现新闻列表展开/收起全文功能
2017/01/20 Javascript
js 事件的传播机制(实例讲解)
2017/07/20 Javascript
vue使用drag与drop实现拖拽的示例代码
2017/09/07 Javascript
vue中设置height:100%无效的问题及解决方法
2018/07/27 Javascript
Vue自定义指令写法与个人理解
2019/02/09 Javascript
JavaScript队列结构Queue实现过程解析
2020/03/07 Javascript
[02:44]DOTA2英雄基础教程 钢背兽
2013/12/19 DOTA
[01:02:04]EG vs Liquid 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.23
2019/09/05 DOTA
给Python中的MySQLdb模块添加超时功能的教程
2015/05/05 Python
简单实现python爬虫功能
2015/12/31 Python
python中nan与inf转为特定数字方法示例
2017/05/11 Python
恢复百度云盘本地误删的文件脚本(简单方法)
2017/10/21 Python
python DataFrame获取行数、列数、索引及第几行第几列的值方法
2018/04/08 Python
Python爬虫设置代理IP(图文)
2018/12/23 Python
对Python 简单串口收发GUI界面的实例详解
2019/06/12 Python
windows10在visual studio2019下配置使用openCV4.3.0
2020/07/14 Python
Python面向对象特殊属性及方法解析
2020/09/16 Python
Python中qutip用法示例详解
2020/10/02 Python
皇马官方商城:Real Madrid Store
2016/09/02 全球购物
幼儿园六一亲子活动方案
2014/08/26 职场文书
四查四看整改措施
2014/09/19 职场文书
先进事迹材料范文
2014/12/29 职场文书
助学感谢信范文
2015/01/21 职场文书
八年级英语教学计划
2015/01/23 职场文书
centos8安装MongoDB的详细过程
2021/10/24 MongoDB