基于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 Jquery 遍历Json的实现代码
Mar 31 Javascript
JavaScript中window.showModalDialog()用法详解
Dec 18 Javascript
Javascript之Date对象详解
Jun 07 Javascript
jQuery实现拖拽页面元素并将其保存到cookie的方法
Jun 12 Javascript
ES2015 Symbol 一种绝不重复的值
Dec 25 Javascript
vue2.0的contextmenu右键弹出菜单的实例代码
Jul 24 Javascript
webpack 打包压缩js和css的方法示例
Mar 20 Javascript
vue axios 给生产环境和发布环境配置不同的接口地址(推荐)
May 08 Javascript
在Vue中使用axios请求拦截的实现方法
Oct 25 Javascript
vue中添加与删除关键字搜索功能
Oct 12 Javascript
Vue proxyTable配置多个接口地址,解决跨域的问题
Sep 11 Javascript
解决ant Design中Select设置initialValue时的大坑
Oct 29 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
简单实用的.net DataTable导出Execl
2013/10/28 PHP
php中current、next与reset函数用法实例
2014/11/17 PHP
php二维数组合并及去重复的方法
2015/03/04 PHP
php阿拉伯数字转中文人民币大写
2015/12/21 PHP
微信公众号支付之坑:调用支付jsapi缺少参数 timeStamp等错误解决方法
2016/01/12 PHP
php文件上传及下载附带显示文件及目录功能
2017/04/27 PHP
完美的php分页类
2017/10/24 PHP
PHP 计算两个时间段之间交集的天数示例
2019/10/24 PHP
DOM下的节点属性和操作小结
2009/05/14 Javascript
javascript showModalDialog,open取得父窗口的方法
2010/03/10 Javascript
JavaScript加强之自定义event事件
2013/09/21 Javascript
jquery实现动态画圆
2014/12/04 Javascript
Jquery中map函数的用法
2016/06/03 Javascript
利用Angularjs和Bootstrap前端开发案例实战
2016/08/27 Javascript
在网页中插入百度地图的步骤详解
2016/12/02 Javascript
Angular自定义组件实现数据双向数据绑定的实例
2017/12/11 Javascript
axios post提交formdata的实例
2018/03/16 Javascript
vue数据操作之点击事件实现num加减功能示例
2019/01/19 Javascript
vue 使用 canvas 实现手写电子签名
2020/03/06 Javascript
js实现百度登录窗口拖拽效果
2020/03/19 Javascript
探究Python多进程编程下线程之间变量的共享问题
2015/05/05 Python
在Python的Django框架中为代码添加注释的方法
2015/07/16 Python
简介Python的collections模块中defaultdict类型的用法
2016/07/07 Python
python使用正则表达式替换匹配成功的组并输出替换的次数
2017/11/22 Python
Tensorflow环境搭建的方法步骤
2018/02/07 Python
python中的django是做什么的
2020/07/31 Python
Jupyter安装链接aconda实现过程图解
2020/11/02 Python
selenium设置浏览器为headless无头模式(Chrome和Firefox)
2021/01/08 Python
HTML5的文档结构和新增标签完全解析
2017/04/21 HTML / CSS
Allen Edmonds官方网站:一家美国优质男士鞋类及配饰制造商
2019/03/12 全球购物
自动化职业生涯规划书范文
2014/01/03 职场文书
企业给企业的表扬信
2014/01/13 职场文书
2014年实习期工作总结
2014/11/27 职场文书
二审答辩状范文
2015/05/22 职场文书
详解Spring Security如何在权限中使用通配符
2022/06/28 Java/Android
Nginx如何配置根据路径转发详解
2022/07/23 Servers