自定义指令 格式化input数据为非负整数
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script src="https://unpkg.com/vue@2.5.16/dist/vue.js"></script>
<div id="app">
<input type="text" v-model="available_time" v-format-floor>
<input type="text" v-model="a" v-format-floor>
<button @click="show">button</button>
</div>
<script>
var vm = new Vue({
el:"#app",
data:{
available_time:"",
a: '',
},
methods:{
show(){
console.log(this.a)
}
},
directives: { "format-floor": {
update: function (e,vnode,oldVnode) {
// 获取变量名字
var temp = oldVnode.data.directives[0].expression;var e = e.value;
e = Math.floor(e) || 0;
vm[temp] = e;
}
}
}
})
</script>
</body>
</html>
自定义指令 格式化input数据为非负整数的更多相关文章
- AngularJS: 自定义指令与控制器数据交互
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- angular5 自定义指令 输入输出 @Input @Output(右键点击事件传递)
指令写法,angular5官网文档给的很详细. 首先要创建一个文件,需注意命名规范(后缀名为xxx.directive.ts): 今天要记录的是在多个li中,右键点击之后显示出对应的菜单,直接上图吧! ...
- PHP自定义函数格式化json数据怎么调用？
<?php/*** Formats a JSON string for pretty printing** @param string $json The JSON to make pretty ...
- 自定义指令 限制input 的输入位数
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8 ...
- Vue自定义指令实现input限制输入正整数
directive.js import Vue from 'vue' export default () => { Vue.directive('Int', { inserted: functi ...
- Vue自定义指令 数据传递
在项目开发过程中,难免会遇到各种功能需要使用Vue自定义指令--directive 去实现 .关于directive的使用方式这里就不做过多的介绍了,Vue官方文档中说的还是听明白的.今天讲讲在使用V ...
- vue自定义指令v-scroll（directive）
vue开发中,很多地方如果说都用到了某一方法,我们就可以进行指令化封装,通过自定义指令来实现这里通过两个例子说明vue-Directive的使用 1.v-focus 主要用来实现页面加载进来的时候文本 ...
- vue3.0自定义指令（drectives)
在大多数情况下,你都可以操作数据来修改视图,或者反之.但是还是避免不了偶尔要操作原生 DOM,这时候,你就能用到自定义指令. 举个例子,你想让页面的文本框自动聚焦,在没有学习自定义指令的时候,我们可能 ...
- VUE3 之 自定义指令的实现 - 这个系列的教程通俗易懂，适合新手
1. 概述 老话说的好:能屈能伸的人生,才是完满而丰富的人生. 言归正传,今天我们来聊聊 VUE 中自定义指令的实现. 2. 自定义指令 2.1 文本框聚焦的实现 <body> < ...
随机推荐
- Cython 使用
链接: Cython是一个快速生成Python扩展模块的工具,从语法层面上来讲是Python语法和C语言语法的混血,当Python性能遇到瓶颈时,Cython直接将C的原生速度植入Python程序,这 ...
- input标签（文本域和文件域）
单行文本域: <form> <input type="text" name="..." ....../> </form> 属 ...
- ZOJ 1005：Jugs（思维）
Jugs Time Limit: 2 Seconds Memory Limit: 65536 KB Special Judge In the movie "Die Har ...
- SSAS aggregation 的作用及其使用
作用: 聚合是为了解决查询在运行时的效率低下,在数据立方体部署的时候进行聚合,实际上是对数据立方体的预处理,方便以后查询.如若在部署时未进行聚合,则在以后每次查询时实际上都会进行一次集合的操作,等待结 ...
- Js 判断输入的验证码是否一致
实现效果: 判断输入的验证码是否一致 如果不同,alert出验证码输入有误~, 输入正确输出登录成功. <!DOCTYPE html> <html lang="en&quo ...
- Easyui datagrid 去掉表头的checkbox复选框
$(".datagrid-header-check").html(""); 在onLoadSuccess中加入此行代码即可实现datagrid去除表头的chec ...
- MongoDB高可用集群搭建（主从、分片、路由、安全验证）
目录 一.环境准备 1.部署图 2.模块介绍 3.服务器准备 二.环境变量 1.准备三台集群 2.安装解压 3.配置环境变量 三.集群搭建 1.新建配置目录 2.修改配置文件 3.分发其他节点 4.批 ...
- sqler sql 转rest api 数据校验的处理
早期版本(2.0 之前)使用rules 进行数据校验处理,2.0 之后进行了修改使用 validators,这样更加明确 参考格式 addpost { // if any rule retu ...
- Singer 学习十 同步模式
sync 模式是属于tap 的操作,同步模式下,tap 需要提交 schema. record .state message, singer 指南对于每种 类型有详细的说明 streams 每个str ...
- 人教版高中数学(A版)
必修1 (已看) 第一章 集合与函数概念 1.1 集合 1.2 函数及其表示 1.3 函数的基本性质 第二章 基本初等函数(1) 2.1 指数函数 2.2 对数函数 2.3 幂函数 第三章 函数的应用 ...