vue绑定数字类型 value为数字的实例

直接加:

 <el-select v-model="searchData.status" filterable placeholder="请选择" @change="gamefilter" class="mr40">
   <el-option label="开启" :value='0'></el-option>
   <el-option label="关闭" :value='1'></el-option>

   <!-- <el-option label="关闭" :value='1'> -->

   </el-select>

补充知识：vue中input，select标签中v-model绑定的值为数字类型情形

背景： vue表单中的input标签v-model 绑定的值，默认情况下是自动转换成String类型的，但是有时候我们不希望它自动转换，该怎么做呢？

1，使用number将绑定的v-model改为number类型

<el-input type="number" v-model.number="age"></el-input>

2，下拉框的option绑定的value是数字，但v-model为String类型的情况，使用:value

<el-select v-model="menuForm.type" placeholder="请选择菜单级别">
  <el-option label="系统" :value="0"></el-option>
  <el-option label="模块" :value="1"></el-option>
  <el-option label="功能" :value="2"></el-option>
</el-select>

以上这篇vue绑定数字类型 value为数字的实例就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持我们。

赞 (0)

相关推荐

  • 详解vue中v-model和v-bind绑定数据的异同

    vue的模板采用DOM模板,也就是说它的模板可以当做DOM节点运行,在浏览器下不报错,绑定数据有三种方式,一种是插值,也就是{{name}}的形式,一种是v-bind,还有一种是v-model.{{name}}的形式比较好理解,就是以文本的形式和实例data中对应的属性进行绑定.比如: var app = new Vue({ el: '#app', template: '<div @click="toggleName">{{name}}</div>', data

  • vue.js自定义组件实现v-model双向数据绑定的示例代码

    我们都清楚v-model其实就是vue的一个语法糖,用于在表单控件或者组件上创建双向绑定. //表单控件上使用v-model <template> <input type="text" v-model="name" /> <input type="checkbox" v-model="checked"/> <!--上面的input和下面的input实现的效果是一样的--> <

  • vue中v-model对select的绑定操作

    1.单选时 <select v-model="selected"> <option disabled value="">请选择</option> <option>A</option> <option>B</option> <option>C</option> </select> <span>Selected: {{ selected }

  • vue中v-model的应用及使用详解

    vue中v-model的应用及使用详解

    vue中经常使用到<input>和<textarea>这类表单元素,vue对于这些元素的数据绑定和我们以前经常用的jQuery有些区别.vue使用v-model实现这些标签数据的双向绑定,它会根据控件类型自动选取正确的方法来更新元素. v-model本质上是一个语法糖.如下代码<input v-model="test">本质上是<input :value="test" @input="test = $event.t

  • vue绑定数字类型 value为数字的实例

    直接加: <el-select v-model="searchData.status" filterable placeholder="请选择" @change="gamefilter" class="mr40"> <el-option label="开启" :value='0'></el-option> <el-option label="关闭"

  • vue select组件绑定的值为数字类型遇到的问题

    目录 select组件绑定的值为数字类型问题 vue中的绑定值 学习重点 select组件绑定的值为数字类型问题 在日常开发中,我们双向绑定的form表单,经常会遇到对数字类型的绑定,但对于v-model 绑定的值,输入数字会自动转成字符串类型. 对于input输入框绑定的值,想要修改为数字类型很简单,只需要使用表单的修饰符就可以.如下所示 number 可以将绑定的 v-model 改为 number 类型 <input v-model.number="age" type=&q

  • vue关于select组件绑定的值为数字类型的问题

    目录 select组件绑定的值为数字类型问题 number可以将绑定的 v-model 改为 number类型 若元素属性需要绑定的值为数字时的处理 1.如果直接这样写 2.解决 select组件绑定的值为数字类型问题 在日常开发中,我们双向绑定的form表单,经常会遇到对数字类型的绑定,但对于v-model 绑定的值,输入数字会自动转成字符串类型. 对于input输入框绑定的值,想要修改为数字类型很简单,只需要使用表单的修饰符就可以. 如下所示: number可以将绑定的 v-model 改为

  • Angularjs 双向绑定时字符串的转换成数字类型的问题

    Angularjs 双向绑定时字符串的转换成数字类型的问题

    问题: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script> </head> <body> <div ng-app="myAp

  • 基于AngularJs select绑定数字类型的问题

    一.AngularJs中select绑定ng-model数字类型绑定问题 使用ng-model绑定select的时候默认是string字符串,如果指定的number值会绑定失败 举例说明: <body ng-app='module' ng-controller="myCtrl"> 请选择性别: <select name="sex" ng-model='sex' > <option value="">请选择<

  • vue 实现强制类型转换 数字类型转为字符串

    我是从页面直接拿的ID过来的,类型是数字类型 后端需要的是字符串类型 只需要在后面加上 + ' ' ,传一个空字符串就可以了 以上这篇vue 实现强制类型转换 数字类型转为字符串就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持我们.

  • Swift内置的数字类型及基本的转换方法

    Swift内置的数字类型及基本的转换方法

    虽然编写任何编程语言,需要使用不同的变量来存储各种信息.变量不过是保留的内存位置来存储值.这意味着,当创建一个变量,在内存中会保留一些空间. 可能喜欢像存储字符串,字符,宽字符,整数,浮点数,布尔等各种数据类型的信息.根据一个变量的数据类型,操作系统分配内存,并决定什么可以存储保留在存储器. 内置数据类型 Swift 为程序员提供内置以及用户定义的种类数据类型. 以下是声明变量使用最频繁的基本数据类型的列表: Int 或 UInt - 这是用于整数.更具体地可以使用Int32,Int64来定义3

  • vue实现web前端登录页数字验证码

    vue实现web前端登录页数字验证码

    本文实例为大家分享了vue实现web前端登录页数字验证码的具体代码,供大家参考,具体内容如下 1.创建code.js文件夹下面是js代码 function GVerify(options) {     console.log(); // 创建一个图形验证码对象,接收options对象为参数     this.con = document.getElementById(options)     this.options = { // 默认options参数值         id: '', //

  • isnumeric检测是否为数字类型的asp代码

    ASP判断是否为数字通常用isnumeric()函数,它的作用是判断里面的参数表达式是不是数值,用法:IsNumeric(内容),如果"内容"最终运算结果为数字,则 IsNumeric 返回 True:否则返回 False.如果 expression 是日期表达式,则 IsNumeric 返回 False. ASP判断是否为数字的具体例子: 复制代码 代码如下: <% if isNumeric(内容)  then Response.Write("是数字") e

  • Oracle数字类型number自增的实现代码

    废话不多说了,直接给大家贴代码了,具体代码如下所示: 创建序列 create sequence seq_student start with 6 increment by 1 maxvalue 500 nominvalue nocycle nocache; 创建触发器 create or replace trigger trigger_student before insert on student for each row declare BEGIN select seq_student.ne

随机推荐