1、到官网下载laydate.js

https://www.layui.com/laydate/

2、下载好后,将包解压好放在index.html同级的地方。我是在public中建立个statick文件夹,放在了里面

3、在index.html中引入

<script src="./static/laydate/layDate-v5.0.9/laydate/laydate.js"></script>

4、在vue组件中使用

<template>
<div class="main">
<input id="test" class="form-control layer-date" placeholder="YYYY-MM-DD hh:mm:ss" v-model="date">
<label class="laydate-icon"></label>
</div>
</template> <script> export default {
data(){
return{
date: '2017-09-08 09:00:00',
}
},
mounted(){
console.log(laydate)
laydate.render({
elem: '#test',
type:'datetime',
done: (value) => {
this.date = value;
console.log(this.date);
}
})
},
methods:{
}
}
</script> <style lang="less" scoped> </style>

vue中使用laydate.js插件的更多相关文章

  1. 解决vue中使用laydate.js选择日期后再修改其他model时日期会被清空问题

    首先描述一下问题,下图中均绑定v-model,例如先选择出生开始时间,然后当再选择地区或其他选项时该时间就会被清空 首先看一下我这边开始的默认值,开始我设置都为空 当我选择如下图的生日开始时间与结束时 ...

  2. vue使用laydate.js插件报错laydate.css: Invalid

    在vue中使用laydate.js插件时可能会碰到laydate.css: Invalid这样子的一个报错 然后导致laydate日期控件无法使用. 这主要是因为laydate.js中引入的layda ...

  3. vue中自定义组件(插件)

    vue中自定义组件(插件) 原创 2017年01月04日 22:46:43 标签: 插件 在vue项目中,可以自定义组件像vue-resource一样使用Vue.use()方法来使用,具体实现方法: ...

  4. vue中config/index.js:配置的详细理解

    当我们需要和后台分离部署的时候,必须配置config/index.js: 用vue-cli 自动构建的目录里面  (环境变量及其基本变量的配置) var path = require('path') ...

  5. vue中使用raphael.js实现地图绘制

    一.效果图 二.在vue中引入raphael.js npm i raphael -S 三.封装一个名为StreetMap的组件,代码如下 <template> <div> &l ...

  6. Vue中使用fullpage.js

    Vue中使用fullpage.js:https://blog.csdn.net/weixin_34184158/article/details/88672739

  7. 在Vue中使用layer.js弹出层插件

    layer.js(mobile)是一个小巧方便的弹出层插件,在之前的apicloud项目中被大量使用,但最近对apicloud的IDE.非常不友好的文档和极低的开发效率深感厌烦,决定弃用然后转向Vue ...

  8. vue中使用剪切板插件 clipboard.js

    vue中使用剪切板需要借助一个插件,clipboard,使用方法还是很简单的,先下载,然后引入: npm i clipboard -S //引入 import Clipboard from 'clip ...

  9. 微信 vue中使用video.js播放m3u8视频,解决安卓自动全屏的问题。

    最近一个项目中需要在微信中播放m3u8格式的视频,刚开始用了 vue-video-player 这个插件,在IOS手机体验良好,本以为完事了, 结果安卓手机一点播放就自动全屏,心态略崩.查了资料说是安 ...

随机推荐

  1. 并不对劲的CF1237D&E:Balanced Playlist and Binary Search Trees

    CF1237D Balanced Playlist 题意 有一个长度为\(n\)(\(n\leq 10^5\))的循环播放歌单,每首歌有一个优秀值\(a_i\)(\(a_i\leq 10^9\)). ...

  2. Linux JDK升级

    一.jdk1.4卸载 Redhat Enterprise 5 中自带安装了jdk1.4,在安装jdk1.6前,把jdk1.4卸载: 1. 首先查看系统自带的JDK版本: [root@linux ~]# ...

  3. vue打包后css背景图片地址找不到

    背景图片变成了这样:static/css/static/imgs/xxx.jpg 解决方法,修改build/utils,添加   publicPath: '../../'    就行 对比了下,com ...

  4. Js的原型和原型链讲解

    原型:每个对象都会在其内部初始化一个属性,就是prototype 原型链:当我们访问一个对象的属性时,如果这个对象内部不存在这个属性,那么他就会去prototype中去找,这个prototype中会有 ...

  5. HTML实现三角形和旗帜代码

    1.三角形 1.1html+css <style> *{ margin: 0px; padding: 0px; } span{ display: block; margin-left: 2 ...

  6. 用vue写一个分页器代码

    分页是项目中常会用到的,网上的插件也很多,但是有些功能太齐全反而不是必要的,所以抽时间自己写了一下(小白写代码,若发现问题还请及时赐教,感激不尽……) 如图,想要一个这样的页码: a. 上一页.下一页 ...

  7. md加密 16位 32位

    16位大写 //生成MD5 public static String getMD5(String message) { String md5 = ""; try { Message ...

  8. php--常见算法1

    <?php //递归输出123321 function digui($num){ echo $num; if($num<3){ digui($num+1); } echo $num; } ...

  9. JavaWeb【五、内置对象】

    简介 Web容器创建的一组对象,不用new即可使用. 共有9种,out.request.response.session.application,五种比较常用,page.pageContent.exc ...

  10. 怎么提高U盘传输文件的性能?

    U盘使用时间久了,其传输复制文件速度就可能会变得有些慢.出现这个问题的原因有很多,除了U盘本身的问题外,也可能会有电脑设置方面的因素在影响.好系统下面就来告诉大家解决U盘传输复制文件速度慢的几个小技巧 ...