参考自:https://mp.weixin.qq.com/s?src=3&timestamp=1527154113&ver=1&signature=tWGeTa86gyK*RL0P7nwlA6-8V14FjzxUTh7CM9kQLjnXjchkqgw6Lm3C5JXI-ba9wmXjXglUMApGCHe2aIvGC-eWC8KuNsUl0PLTWLjdbjhiVZDS9SGRQuOc-pe0achyII43bi*cyMkSHrrC2Vb8d0Q0OW7DrF-RZ202wJqKED4=

正确引入方式

最简单靠谱的方式是用库变成Vue的原型对象的属性。

import moment from 'moment';
Object.definePrototype(Vue.prototype, '$moment', { value: moment });

也可以:

Vue.prototype.$moment = moment;

由于所有的组件都会继承Vue原型对象上的方法,因此这些方法在任何组件文件中都能通过this.$moment 访问到:

export default {
created() {
console.log('The time is ' . this.$moment().format("HH:mm"));
}
}

Vue框架引入JS库的正确姿势的更多相关文章

  1. 必备技能六、Vue框架引入JS库的正确姿势

    在Vue.js应用中,可能需要引入Lodash,Moment,Axios,Async等非常好用的JavaScript库.当项目变得复杂庞大,通常会将代码进行模块化拆分.可能还需要跑在不同的环境下,比如 ...

  2. 050——VUE中使用js库控制vue过渡动作

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 在Vue将第三方JS库封装为组件使用

    第三方JS库地址:https://github.com/inorganik/CountUp.js 使用NPM进行安装: npm install --save countup 根据官方回答,CountU ...

  4. uni-app 引入本地iconfont的正确姿势以及阿里图标引入

    1.引入本地iconfont iconfont文件里面包含 iconfont.ttf.iconfont.css, 将 iconfont.tt64文件转位 base64.推荐转换工具地址:https:/ ...

  5. 在vue项目中封装echarts的正确姿势

    为什么需要封装echarts 每个开发者在制作图表时都需要从头到尾书写一遍完整的option配置,十分冗余 在同一个项目中,各类图表设计十分相似,甚至是相同,没必要一直做重复工作 可能有一些开发者忘记 ...

  6. vue中引入js,然后new js里的方法

    阿里云Web播放器Web端使用SDK说明:https://help.aliyun.com/document_detail/51991.html?spm=5176.11065259.1996646101 ...

  7. vue项目 引入js文件

    例如我想将laydate.js引到vue项目中 将用到的js文件放到static文件夹内,在项目的根目录下的index.html内引入 <script src="static/js/l ...

  8. Vue全局引入JS的方法

    两种情况: 1. js为ES5的写法时,如下(自定义的my.js): function fun(){ console.log('hello'); } Vue中的全局引入方式为,在index.html中 ...

  9. composer安装第三方的库packagist.org(laravel框架引入第三方库)

    建立composer.json composer require phpoffice/phpexcel //安装一个excel扩展库 composer require gregwar/captcha ...

随机推荐

  1. web自动化测试:watir+minitest(三)

    本文,谢绝转载. 整体框架设计: 1.用例的解耦性.一个测试用例一个脚本.而并非minitest中的N个test写在一个文件中 2.单独调试与全量连跑或部分连跑 3.任意变量.参数配置.这点对后期维护 ...

  2. oracle中用rownum分页并排序的查询SQL语句

    oracle的sql语句中没有limit,limit是mysql中特有的,在oracle中可用rownum来表示,用于查询结果中的前N行数据. 如要查询emp表中的前5行数据,可用如下语句: sele ...

  3. no for & 100 Array & Uint8Array & Typed Arrays

    no for & 100 Array http://hiluluke.cn/ bad function generate100Array() { var arr = new Array(100 ...

  4. 【bzoj2096】[Poi2010]Pilots 双指针法+STL-set

    题目描述 Tz又耍畸形了!!他要当飞行员,他拿到了一个飞行员测试难度序列,他设定了一个难度差的最大值,在序列中他想找到一个最长的子串,任意两个难度差不会超过他设定的最大值.耍畸形一个人是不行的,于是他 ...

  5. EPEL 安装源

    EPEL 安装源 EPEL 是 Extra Packages for Enterprise Linux 的缩写(EPEL),是用于 Fedora-based Red Hat Enterprise Li ...

  6. Redis集群_主从配置

    链接地址http://www.2cto.com/database/201502/377069.html 收藏备用. Redis主从配置(Master-Slave) 一. Redis Replicati ...

  7. Hadoop体系所有组件默认端口列表

    Why? Hadoop集群组件太多,默认端口无法记住,有事后需要查看,就在这里罗列下这里包含我们使用到的组件:HDFS, YARN, Hbase, Hive, ZooKeeper。 What? 端口 ...

  8. iOS之UITraitCollection

    UITraitCollection 为表征 size class 而生,用来区分设备.你可以在它身上获取到足以区分所有设备的特征. UITraitEnvironment 协议.UIContentCon ...

  9. 转:java native

    今日在hibernate源代码中遇到了native关键词,甚是陌生,就查了点资料,对native是什么东西有了那么一点了解,并做一小记. native关键字说明其修饰的方法是一个原生态方法,方法对应的 ...

  10. Python之访问set

    dict的作用是建立一组 key 和一组 value 的映射关系,dict的key是不能重复的. 有的时候,我们只想要 dict 的 key,不关心 key 对应的 value,目的就是保证这个集合的 ...