基于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 相关文章推荐
加载远程图片时,经常因为缓存而得不到更新的解决方法(分享)
Jun 26 Javascript
JavaScript 表单处理实现代码
Apr 13 Javascript
兼容浏览器的js事件绑定函数(详解)
May 09 Javascript
VUE元素的隐藏和显示(v-show指令)
Jun 23 Javascript
JavaScript生成图形验证码
Aug 24 Javascript
利用Ionic2 + angular4实现一个地区选择组件
Jul 27 Javascript
JavaScript实现多叉树的递归遍历和非递归遍历算法操作示例
Feb 08 Javascript
vue 表单输入格式化中文输入法异常问题
May 30 Javascript
详解angular脏检查原理及伪代码实现
Jun 08 Javascript
JS/HTML5游戏常用算法之碰撞检测 地图格子算法实例详解
Dec 12 Javascript
vue-router路由懒加载及实现的3种方式
Feb 28 Vue.js
详解Vue.js 可拖放文本框组件的使用
Mar 03 Vue.js
微信小程序有旋转动画效果的音乐组件实例代码
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
星际中一些鲜为人知的详细资料
2020/03/04 星际争霸
用PHP连接Oracle for NT 远程数据库
2006/10/09 PHP
PHP中动态显示签名和ip原理
2007/03/28 PHP
PHP session有效期session.gc_maxlifetime
2011/04/20 PHP
php设计模式 Proxy (代理模式)
2011/06/26 PHP
php二维数组排序方法(array_multisort usort)
2013/12/25 PHP
php+mysql结合Ajax实现点赞功能完整实例
2015/01/30 PHP
PHP重置数组为连续数字索引的几种方式总结
2018/03/12 PHP
[原创]后缀就扩展名为js的文件是什么文件
2007/12/06 Javascript
把html页面的部分内容保存成新的html文件的jquery代码
2009/11/12 Javascript
基于jQuery试卷自动排版系统
2010/07/18 Javascript
JS中不为人知的五种声明Number的方式简要概述
2013/02/22 Javascript
JQuery文本改变触发事件如聚焦事件、失焦事件
2014/01/15 Javascript
JavaScript编程的单例设计模讲解
2015/11/10 Javascript
json实现添加、遍历与删除属性的方法
2016/06/17 Javascript
AngularJs ng-repeat 嵌套如何获取外层$index
2016/09/21 Javascript
Jquery Easyui搜索框组件SearchBox使用详解(19)
2016/12/17 Javascript
Python删除指定目录下过期文件的2个脚本分享
2014/04/10 Python
Python获取Linux系统下的本机IP地址代码分享
2014/11/07 Python
Python解决鸡兔同笼问题的方法
2014/12/20 Python
Python里disconnect UDP套接字的方法
2015/04/23 Python
Python多进程库multiprocessing中进程池Pool类的使用详解
2017/11/24 Python
Python使用Tkinter实现滚动抽奖器效果
2020/01/06 Python
Pytorch GPU显存充足却显示out of memory的解决方式
2020/01/13 Python
浅谈Python中os模块及shutil模块的常规操作
2020/04/03 Python
Python requests接口测试实现代码
2020/09/08 Python
美国社交购物市场:MassGenie
2019/02/18 全球购物
西班牙鞋子和箱包在线销售网站:zapatos.es
2020/02/17 全球购物
英文翻译的自我评价语句
2013/10/04 职场文书
车间班组长岗位职责
2013/11/13 职场文书
电子商务个人自荐信
2013/12/12 职场文书
孩子教育的心得体会
2014/09/01 职场文书
教师竞聘上岗演讲稿
2014/09/03 职场文书
大学生实训报告总结
2014/11/05 职场文书
MySQL令人大跌眼镜的隐式转换
2021/08/23 MySQL
python处理json数据文件
2022/04/11 Python