<input id="time1"  readonly="readonly"  placeholder="这里选择时间" v-model='input3' />
——
<input id="time2" readonly="readonly" placeholder="这里选择时间" v-model='input4'/>

在vue数据data中定义两个对应的数据

        input3: '',
input4: '',

在vue初始化时处理laydata绑定事件  ,这里使用的延迟加载,为了避免顺序问题导致无法使用

在时间选择结束时将值赋给vue的数据,不然vue的数据并没有随着时间改变而改变

         //用于数据初始化
created:function(){
setTimeout( function(){
laydate.render({
elem: "#time1", //指定元素
type: 'datetime',
format:'yyyy-MM-dd HH:mm:ss',
trigger: 'click',
done:function(value, date, endDate){
vue.input3=value;
}
});
laydate.render({
elem: "#time2", //指定元素
type: 'datetime',
format:'yyyy-MM-dd HH:mm:ss',
trigger: 'click',
done:function(value, date, endDate){
vue.input4=value;
}
});
}, * );
},

需要引入vue.js和laydate.js

vue中使用时间插件、vue使用laydate的更多相关文章

  1. Vue中better-scroll插件的使用

    实现原理:父容器固定高度,并设置属性overflow: hidden,使得子元素高度超出容器后能被隐藏.better-scroll作用在父容器上.1.npm安装better-scroll插件.npm ...

  2. Vue学习之--------Vue中自定义插件(2022/8/1)

    文章目录 1.插件的基本介绍 2.实际应用 2.1 目录结构 2.2 代码实例 2.2.1 学校组件(School.vue) 2.2.2 学生组件(Student.vue) 2.2.3 定义的插件 2 ...

  3. vue中自定义指令vue.direvtive,自定义过滤器vue.filter(),vue过渡transition

    自定义指令 默认设置的核心指令( v-model,v-bind,v-for,v-if,v-on等 ),Vue 也允许注册自定义指令.注意,在 Vue2.0 里面,代码复用的主要形式和抽象是组件——然而 ...

  4. Vue Google浏览器插件 Vue Devtools无法使用的解决办法

    1.插件安装不必多说  一定要用Vue.js 开发版    Vue.min.js 在控制面板就不会显示 2.本地调试 用的是file://协议 修改插件允许访问文件网址  打上对勾

  5. vue中常用插件(货币、日期)

    货币插件: 价格格式化 // https://github.com/vuejs/vuex/blob/dev/examples/shopping-cart/currency.js const digit ...

  6. Vue中qs插件的使用

    qs 是一个增加了一些安全性的查询字符串解析和序列化字符串的库. 在项目中使用命令行工具输入:npm install qs安装完成后在需要用到的组件中:import qs from ‘qs’具体使用中 ...

  7. vue中引入swiper(vue中的滑块组件vue-awesome-swiper)

    第一步安装 npm install vue-awesome-swiper --save 第二部在main.js中引入 import VueAwesomeSwiper from 'vue-awesome ...

  8. Vue安装及插件Vue Devtools

    vue安装: # 最新稳定版 $ npm install vue # 全局安装 vue-cli $ npm install --global vue-cli # 创建一个基于 webpack 模板的新 ...

  9. [vue]初探vue生态核心插件Vuex

    为什么会有 Vuex 这个东西 ? 一个应用内部运行的机制,事件 -> 状态 -> UI,我们的前端常常会因为这两个过程而产生大量代码,从而变得难以维护. vue的声明式渲染,解决了从 状 ...

随机推荐

  1. spring框架学习(一)——IOC/DI

    什么是Spring框架: Spring是一个基于IOC和AOP的结构J2EE系统的框架: IOC 反转控制 是Spring的基础,Inversion Of Control,简单说就是创建对象由以前的程 ...

  2. 【真】CSP2019退役记(upd:12.21)

    这是第一次CSP(Counter-Strike Professor),也是最后一次. Day-1 上午考试,日常被虐. 下午颓mc Day0 上午考试,日常被虐. 下午颓mc 晚上看了下悬线法.最小表 ...

  3. VIM编辑器使用的小技巧

    在命令中输入 vi –t 类型名.结构体名或者函数名 系统就会寻找相应的对象,默认是在当前目录的 tags 中搜索,例如我们想寻找 stat 结构体, 则输入 vi –t  stat 然后按 q 退出 ...

  4. Java 之 List 接口

    一.List 接口介绍 java.util.List 接口继承自 Collection 接口,是单列集合的一个重要分支,习惯性地会将实现了 List 接口的对象称为 List 集合. 在 List 集 ...

  5. 8 smali文件格式

    Apktool反编译apk后程序中每一个类都会有一个smali文件. 一.当前类信息:smali文件的头三行描述了当前类的一些信息. Eg: .class <访问权限> [修饰关键字]&l ...

  6. k8s网络配置管理

    docker容器的四种网络类型 1.桥接           2.联盟    3.主机    4.无 docker跨节点的容器通信必须通过NAT机制  宿主机上的容器一般都是私网地址 它可以通过宿主机 ...

  7. Spring源码阅读总结(Ing)

    一.Spring源码架构 Spring源码地址 二.Spring中的设计模式 1.工厂模式 BeanFactory 2.模板模式 模板的使用者只需设计一个具体的类,集成模板类,然后定制那些具体方法,这 ...

  8. Spark基于自定义聚合函数实现【列转行、行转列】

    一.分析 Spark提供了非常丰富的算子,可以实现大部分的逻辑处理,例如,要实现行转列,可以用hiveContext中支持的concat_ws(',', collect_set('字段'))实现.但是 ...

  9. Python装饰器与闭包

    闭包是Python装饰器的基础.要理解闭包,先要了解Python中的变量作用域规则. 变量作用域规则 首先,在函数中是能访问全局变量的: >>> a = 'global var' & ...

  10. Mysql一些常见语句

    Mysql一些常见语句 (1)展示所有的数据库名 SHOW DATABASES (2)选中某一个数据库 USE 数据库名字 (3)查看某一个表的结构 DESC 表名 (4)数据库的创建 CREATE ...