基于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 相关文章推荐
原生js实现半透明遮罩层效果具体代码
Jun 06 Javascript
jQuery之尺寸调整组件的深入解析
Jun 19 Javascript
Jquery chosen动态设置值实例介绍
Aug 08 Javascript
在javascript中如何得到中英文混合字符串的长度
Jan 17 Javascript
巧用局部变量提升javascript性能
Feb 24 Javascript
JS实现向表格中动态添加行的方法
Mar 30 Javascript
jquery实现的淡入淡出下拉菜单效果
Aug 25 Javascript
JSON格式的时间/Date(2367828670431)/格式转为正常的年-月-日 格式的代码
Jul 27 Javascript
jQuery实现的模仿雨滴下落动画效果
Dec 11 jQuery
详解mpvue中小程序自定义导航组件开发指南
Feb 11 Javascript
Element图表初始大小及窗口自适应实现
Jul 10 Javascript
js 数据类型判断的方法
Dec 03 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
追忆往昔!浅谈收音机的百年发展历史
2021/03/01 无线电
php入门小知识
2008/03/24 PHP
php验证邮箱和ip地址最简单方法汇总
2015/10/30 PHP
PHP数组操作简单案例分析
2016/10/15 PHP
php usort 使用用户自定义的比较函数对二维数组中的值进行排序
2017/05/02 PHP
客户端脚本中常常出现的一些问题和调试技巧
2007/01/09 Javascript
JavaScript 基于原型的对象(创建、调用)
2009/10/16 Javascript
jquery实现文本框鼠标右击无效以及不能输入的代码
2010/11/05 Javascript
JavaScript中使用正则匹配多条,且获取每条中的分组数据
2010/11/30 Javascript
JavaScript实现页面实时显示当前时间的简单实例
2013/07/20 Javascript
JavaScript中的parse()方法使用简介
2015/06/12 Javascript
js仿3366小游戏选字游戏
2016/04/14 Javascript
Boostrap入门准备之border box
2016/05/09 Javascript
BootStrap便签页的简单应用
2017/01/06 Javascript
使用ionic在首页新闻中应用到的跑马灯效果的实现方法
2017/02/13 Javascript
初学者AngularJS的环境搭建过程
2017/10/27 Javascript
Vue项目中跨域问题解决方案
2018/06/05 Javascript
vue awesome swiper异步加载数据出现的bug问题
2018/07/03 Javascript
详解vuex 渐进式教程实例代码
2018/11/27 Javascript
教你完全理解ReentrantLock重入锁
2019/06/03 Javascript
js canvas实现星空连线背景特效
2019/11/01 Javascript
JS数组的常用10种方法详解
2020/05/08 Javascript
Vue 同步异步存值取值实现案例
2020/08/05 Javascript
[00:18]天涯墨客三技能展示
2018/08/25 DOTA
[01:00:49]DOTA2-DPC中国联赛 正赛 Ehome vs iG BO3 第二场 1月31日
2021/03/11 DOTA
Python序列化与反序列化pickle用法实例
2019/11/11 Python
在网上学习全世界最好的课程:Coursera
2017/11/07 全球购物
预备党员思想汇报范文
2014/01/11 职场文书
大学生两会精神学习心得体会
2014/03/10 职场文书
大学毕业生求职自荐书
2014/06/05 职场文书
中队活动总结
2014/08/27 职场文书
课外科技活动总结
2014/08/27 职场文书
大学生第一学年自我鉴定
2014/09/12 职场文书
2016年秋季趣味运动会开幕词
2016/03/04 职场文书
SQL注入篇学习之盲注/宽字节注入
2022/03/03 MySQL
SQL bool盲注和时间盲注详解
2022/07/23 SQL Server