基于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 serializeArray()一起使用的函数,主要来方便提交表单
Jan 31 Javascript
js数组的基本用法及数组根据下标(数值或字符)移除元素
Oct 20 Javascript
jQuery中hover与mouseover和mouseout的区别分析
Dec 24 Javascript
Google 地图叠加层实例讲解
Aug 06 Javascript
VC调用javascript的几种方法(推荐)
Aug 09 Javascript
vuejs在解析时出现闪烁的原因及防止闪烁的方法
Sep 19 Javascript
xmlplus组件设计系列之网格(DataGrid)(10)
May 05 Javascript
浅谈jQuery框架Ajax常用选项
Jul 08 jQuery
VUE axios上传图片到七牛的实例代码
Jul 28 Javascript
JS实现移动端判断上拉和下滑功能
Aug 07 Javascript
javascript实现前端input密码输入强度验证
Jun 24 Javascript
详解Vue中Axios封装API接口的思路及方法
Oct 10 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 Embed SAPI实现Opcodes查看器
2015/11/10 PHP
制作个性化的WordPress登陆界面的实例教程
2016/05/21 PHP
兼容FF和IE的动态table示例自写
2013/10/21 Javascript
基于NodeJS的前后端分离的思考与实践(五)多终端适配
2014/09/26 NodeJs
node.js中的path.basename方法使用说明
2014/12/09 Javascript
基于jquery和svg实现超炫酷的动画特效
2014/12/09 Javascript
JavaScript删除数组元素的方法
2015/03/20 Javascript
jQuery实现防止提交按钮被双击的方法
2015/03/24 Javascript
微信小程序 地图(map)实例详解
2016/11/16 Javascript
原生js 封装get ,post, delete 请求的实例
2017/08/11 Javascript
Node.js实现发送邮件功能
2017/11/06 Javascript
JavaScript实现二叉树定义、遍历及查找的方法详解
2017/12/20 Javascript
浅谈React高阶组件
2018/03/28 Javascript
详解Webpack + ES6 最新环境搭建与配置
2018/06/04 Javascript
JS事件绑定的常用方式实例总结
2019/03/02 Javascript
JavaScript强制类型转换和隐式类型转换操作示例
2019/05/01 Javascript
vue-resourc发起异步请求的方法
2020/02/11 Javascript
python下MySQLdb用法实例分析
2015/06/08 Python
详解Python的Django框架中inclusion_tag的使用
2015/07/21 Python
Python基于time模块求程序运行时间的方法
2017/09/18 Python
python中pip的安装与使用教程
2018/08/10 Python
python 多线程中子线程和主线程相互通信方法
2018/11/09 Python
将pip源更换到国内镜像的详细步骤
2019/04/07 Python
浅谈tensorflow 中tf.concat()的使用
2020/02/07 Python
Python实现PS滤镜中的USM锐化效果
2020/12/04 Python
HTML5中的Scoped属性使用实例
2014/04/23 HTML / CSS
viagogo英国票务平台:演唱会、体育比赛、戏剧门票
2017/03/24 全球购物
Looking4Parking美国:全球排名第一的机场停车比较品牌
2019/08/26 全球购物
Blue Nile蓝色尼罗河香港官网:世界最大在线钻石珠宝销售商
2020/05/07 全球购物
收银员岗位职责
2014/02/07 职场文书
教师中国梦演讲稿
2014/04/23 职场文书
航海技术专业毕业生推荐信
2014/07/09 职场文书
常务副县长“四风”个人对照检查材料思想汇报
2014/10/02 职场文书
2015最新民情日记范文
2015/06/26 职场文书
销售会议开幕词
2016/03/04 职场文书
vue实现简易音乐播放器
2022/08/14 Vue.js