很久没更新博客了,最近在项目中遇到了这么一个问题,需要在Vue项目中,引入原生的js;也需要在原生的js中调用vue组件的函数。
一、Vue中引入原生未封装js
一般情况下对于已封装的js文件,只需要import该js,然后直接使用即可,但是问题就出现在该js未封装。
最终的解决办法,将该js引入到index.html中,然后在需要的地方直接使用即可,无需再次引入。
<!--加载第三方未封装的js-->
<script src="./js/test.js"></script>
二、第三方原生js引入vue组件内函数
由于第三方原生js未封装,无法通过import vue组件的方式引入,即使vue组件已封装。
最终的解决办法是将,vue组件中的函数提升为window函数,然后在原生js文件中通过window.的方式使用。
//将vue组件内函数,提升为window函数
mounted(){
window.test = this.test; //test为vue组件内函数
},
//第三方原生js中引入
function yuansheng(){
window.test();
}
欢迎指正,互相进步~