咸鱼总算找到点内容可以水一下随笔
首先我们到bootcdn(https://www.bootcdn.cn/)去找我们要用到的库的连接,找到moment.js
点击进入之后,找到以下连接
https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/moment.js
https://cdn.bootcdn.net/ajax/libs/moment.js/2.29.1/moment.min.js
这两个连接都可以用,然后在script标签用src导入即可
我们可以在moment.js的首页和文档中可以查询该库的使用
例如:
moment().format('MMMM Do YYYY, h:mm:ss a');
或者
moment(date参数).format('YYYY-MM-DD HH:mm:ss');
好,以上内容均可跳过(划掉)
相关代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="js/vue.js"></script> <script src="https://cdn.bootcdn.net/ajax/libs/moment.js/2.21.0/moment.js"></script> </head> <body> <div id="test"> <h2>显示格式化的日期时间</h2> <p>{{date}}</p> <p>完整版:{{date | dateString}}</p> <p>年月日:{{date | dateString('YYYY-MM-DD')}}</p> <p>时分秒:{{date | dateString('HH:mm:ss')}}</p> </div> <script> // 自定义过滤器 //函数对象 Vue.filter('dateString',function(value,format='YYYY-MM-DD HH:mm:ss'){//形参默认值 return moment(value).format(format); }); new Vue({ el:'#test', data:{ date:new Date() } }) </script> </body> </html>最终实现
由于本人过于咸鱼,所以随笔写的极差,还有不清楚的可以通过
https://www.bilibili.com/video/BV1Wp411d7Ur?p=16&spm_id_from=pageDriver
这个视频了解更加详细的内容