自定义指令 格式化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> < ...
随机推荐
- [LeetCode&Python] Problem 762. Prime Number of Set Bits in Binary Representation
Given two integers L and R, find the count of numbers in the range [L, R](inclusive) having a prime ...
- Hexo重装小结
安装好node.js后: 使用命令npm install -g hexo,很慢,基本安装不了. 换用淘宝镜像: $ npm install -g cnpm --registry=https://reg ...
- css实现三栏布局,两边定宽,中间自适应
1.利用定位实现 css代码如下: .box{overflow: hidden;height: 100px;margin: 10px 0;} .box>div{height: 100%;} #b ...
- 51Nod 1240:莫比乌斯函数
1240 莫比乌斯函数 基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题 收藏 关注 莫比乌斯函数,由德国数学家和天文学家莫比乌斯提出.梅滕斯(Mertens)首先使 ...
- mybatis下的分页,支持所有的数据库
大家都知道,mybatis的自带分页方法只是逻辑分 页,如果数据量很大,内存一定会溢出,不知道为什么开源组织不在里面集成hibernate的物理分页处理方法!在不修改mybatis源代码的情况下, 应 ...
- MySQL主从、环境搭建、主从配制
1. MySQL主从介绍 2.环境搭建 2.主从配制:修改主配制文件:vim /etc/my.cnf添加: server_id = ###log_bin = diy_name然后保存重启:/ ...
- Web安全 概述
转载自 “余弦”大牛的评论 https://www.zhihu.com/question/21606800 大牛的个人blog:http://evilcos.me/ 作者:余弦链接:https://w ...
- Nginx + php-fpm
www.example.com | | Nginx | | 路由到www.example.com/index.php | | 加载nginx的fast-cgi模块 | | fast-cgi监听127. ...
- c#接口与虚函数的实验报告
1)定义Student类,用string型变量name存储学生姓名,用int型变量age存储学生年龄.Student类实现IComparable接口.要求从键盘输入学生的姓名和年龄,并注意可能出现的异 ...
- ★ MYSQL隔离级别 通俗理解 + mysql、oracle默认事务隔离级别
★ 脏读 : 读取了前一事务 未提交 的数据 ; 不可重复读 : 读取了前一事务 提交 的数据: ★ 幻读 与 不可重复读 common :都是读取了另一条已经提交的事务(这点与脏读不 ...