VUE引入第三方js包及调用方法讲解


Posted in Javascript onMarch 01, 2019

VUE引入第三方js包及调用方法

1、首先是第三方js包存放的位置 一定要放在 static 目录下否则引用不到

2、网上查找到的引用第三方包的四种方式 实测部分第三方js包没法使用,较稳定的方式是在 index.html 中引入js包      

<script src="static/xxxxx.js"></script>

3、mounted 是初始化加载的方法 可以理解为jquery 中的页面加载完的初始化方法 如果第三方包有初始化需要调用的一些函数等 需要写在mounted 中  

4、第三方js包如果有回调函数需要写实现 也需要写在 mounted  中让其初始化出来 否则js包 回调不到 代码如下

<script>  
  export default {
    name: 'HelloWorld',
    data () {
      return {
        msg: 'Welcome to Your Vue.js App'
      }
    },mounted () {
      /* eslint-disable */
      // 第三方js包 初始化方法
      Init("divId");
      // 初始化一个变量
      var id_tmp ='';
      // 回调函数 
      huidiaohanshu = function(id){
        console.log(id);
        if(id_tmp != ''){
          console.log(id_tmp);
        }
        id_tmp = id;
      }            
    },methods: {
      aaa:function (){
        // 点击事件 可以直接调用引入的第三方包中的函数
      }
    }
  }  
</script>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作具有一定的参考学习价值,谢谢大家对三水点靠木的支持。如果你想了解更多相关内容请查看下面相关链接

Javascript 相关文章推荐
一些常用的Javascript函数
Dec 22 Javascript
用jquery实现的模拟QQ邮箱里的收件人选取及其他效果(一)
Jan 06 Javascript
使用js实现一个可编辑的select下拉列表
Feb 20 Javascript
兼容IE、firefox以及chrome的js获取时间(getFullYear)
Jul 04 Javascript
js实现无缝循环滚动
Jun 23 Javascript
Node.js如何使用Diffie-Hellman密钥交换算法详解
Sep 05 Javascript
Vue项目中使用Vux的安装过程
May 01 Javascript
jQuery UI实现动画效果代码分享
Aug 19 jQuery
vue中使用mxgraph的方法实例代码详解
May 17 Javascript
node.js文件操作系统实例详解
Nov 05 Javascript
vue Treeselect 树形下拉框:获取选中节点的ids和lables操作
Aug 15 Javascript
Vue + iView实现Excel上传功能的完整代码
Jun 22 Vue.js
JavaScript数据结构与算法之二叉树添加/删除节点操作示例
Mar 01 #Javascript
JavaScript数据结构与算法之二叉树实现查找最小值、最大值、给定值算法示例
Mar 01 #Javascript
Angular7.2.7路由使用初体验
Mar 01 #Javascript
vuex实现及简略解析(小结)
Mar 01 #Javascript
简单两步使用node发送qq邮件的方法
Mar 01 #Javascript
Vue实现类似Spring官网图片滑动效果方法
Mar 01 #Javascript
[原创]微信小程序获取网络类型的方法示例
Mar 01 #Javascript
You might like
PHP的可变变量名的使用方法分享
2012/02/05 PHP
PHP包含文件函数include、include_once、require、require_once区别总结
2014/04/05 PHP
CI(CodeIgniter)框架实现图片上传的方法
2017/03/24 PHP
PHP使用第三方即时获取物流动态实例详解
2017/04/27 PHP
jQuery 图像裁剪插件Jcrop的简单使用
2009/05/22 Javascript
jQuery.Validate验证库的使用介绍
2013/04/26 Javascript
JS弹出窗口插件zDialog简单用法示例
2016/06/12 Javascript
BootStrap实现手机端轮播图左右滑动事件
2016/10/13 Javascript
JS实现类似51job上的地区选择效果示例
2016/11/17 Javascript
微信小程序之小豆瓣图书实例
2016/11/30 Javascript
jQuery Validate验证表单时多个name相同的元素只验证第一个的解决方法
2016/12/24 Javascript
原生js获取left值和top值的三种方法
2017/08/02 Javascript
jQuery 利用ztree实现树形表格的实例代码
2017/09/27 jQuery
基于js文件加载优化(详解)
2018/01/03 Javascript
微信小程序实现蒙版弹窗效果
2018/11/01 Javascript
Jquery如何使用animation动画效果改变背景色的代码
2020/07/20 jQuery
微信小程序跳一跳游戏 python脚本跳一跳刷高分技巧
2018/01/04 Python
python写一个md5解密器示例
2018/02/23 Python
python email smtplib模块发送邮件代码实例
2018/04/26 Python
判断python字典中key是否存在的两种方法
2018/08/10 Python
python paramiko利用sftp上传目录到远程的实例
2019/01/03 Python
python3+selenium获取页面加载的所有静态资源文件链接操作
2020/05/04 Python
pytorch cuda上tensor的定义 以及减少cpu的操作详解
2020/06/23 Python
python matlab库简单用法讲解
2020/12/31 Python
CSS3径向渐变之大鱼吃小鱼之孤单的大鱼
2016/04/26 HTML / CSS
CSS3制作漂亮的照片墙的实现代码
2016/06/08 HTML / CSS
Roxy美国官网:澳大利亚冲浪、滑雪健身品牌
2016/07/30 全球购物
金蝶的一道SQL笔试题
2012/12/18 面试题
十八大感想感言
2014/02/10 职场文书
法学自荐信
2014/06/20 职场文书
庆六一文艺汇演活动方案
2014/08/26 职场文书
乡镇干部个人对照检查材料(群众路线)
2014/09/26 职场文书
2014年教务处工作总结
2014/12/03 职场文书
2015年后勤工作总结范文
2015/04/08 职场文书
Win11应用商店打开闪退怎么解决? win11应用商店打不开的多种解决办法
2022/04/05 数码科技
Golang数据类型和相互转换
2022/04/12 Golang