<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. 第二章 Maven 构建 Java Web项目

    本教程中,我们将教给大家如何创建一个基于Spring MVC 的 Maven Web Project. 用到的技术/工具: 1.Eclipse 4.9 2.Maven 3.6.2 3.Tomcat 8 ...

  2. Vue相关知识点记录

    1.安装 vue不支持ie8以下版本(无法模拟ECMAScript5特性),支持所有兼容ECMAScript5的浏览器. 浏览器安装Vue Devtools, 可以在更友好的界面中审查和调试Vue应用 ...

  3. vue组件6 使用vue添加样式

    class绑定,内联样式 数组语法 :class="[stylename]"    js:data{stylename:classname} 对象语法:class={stylena ...

  4. JavaScript 之 String 对象

    String 对象 之前学习的是 基本数据类型 String 类型,现在讨论的是 String对象(包装类型). String的特点:字符串的不可变性. var str = 'abc'; str = ...

  5. Python人工智能常用库Numpy使用入门

    第一章 jupyter notebook简单教程 命令模式按键esc开启 Enter : 转入编辑模式 Shift-Enter : 运行本单元,选中下个单元 Ctrl-Enter : 运行本单元 Al ...

  6. YUM方法安装mysql5.7版本

      版权声明:本文为博主原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明. 本文链接:https://blog.csdn.net/kabolee/article/deta ...

  7. 无法读取例程 &ROUTINE 中配置文件选项 FND_DEVELOPER_MODE

    问题描述:OM>发运>事务处理,进入此界面,FORM出现报错信息:无法读取例程 &ROUTINE 中配置文件选项 FND_DEVELOPER_MODE 解决办法:在系统管理员下,设 ...

  8. Win10下免安装版MySQL5.7的安装和配置

    1.MySQL5.7解压 2.新建配置文件my.ini放在D:\Free\mysql-5.7.26-winx64目录下 [mysql] # 设置mysql客户端默认字符集 default-charac ...

  9. linux开发中常用的命令及技巧(连载)

    1.在内核或uboot目录下搜索相关内容/文件名时:grep "USB" * -nR find -name "*USB*" 2.查看系统中设备 cat  /pr ...

  10. Python装饰器与闭包

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