vue项目中 如何让外部引入的js模块 的this值 指向vue实例
当前是vue项目,想在tool.js(工具模块)中封装一个跳转页面的方法,
goToUrl(name,query){
if(query){
if(query.addressCode){
vueObject.KaTeX parse error: Expected 'EOF', got '}' at position 52: …; }̲else{ …router.push({name:name,query:query});
}
}else{
var query = {};
query.addressCode = this.getParam(‘addressCode’);
this.$router.push({name:name,query:query});
}
}
上面使用router,query传参的方式实现页面跳转
然后我在vue页面中调用,此方法如:
query.addressCode = tool.getAddressCode();
query.groupId = id;
tool.goToUrl(‘productDetails’,query);
之后报错就来了,提示:push是undefined
然后console了一下goToUrl()方法里面的this,指向的是tool.js整个模块对象!
知道问题所在后,剩下的就是解决了,如何让goToUrl()方法中的this指向vue实例呢?
我第一个想到的就是,在调用tools.js的页面 将vue实例传给 该方法,我们只需要在方法内多加一个参数,将vue实例传过来就行了,看后续代码:
goToUrl(vueObject,name,query){
if(query){
if(query.addressCode){
vueObject.KaTeX parse error: Expected 'EOF', got '}' at position 51: …); }̲else{ …router.push({name:name,query:query});
}
}else{
var query = {};
query.addressCode = this.getParam(‘addressCode’);
vueObject.$router.push({name:name,query:query});
}
}
vueObject参数就是vue实例
在页面中使用时:
var self = this;
var query = {};
query.addressCode = tool.getAddressCode();
query.groupId = id;
tool.goToUrl(self,‘productDetails’,query);
self就是vue实例
- webpack+vue-cli项目中引入外部非模块格式js的方法
- Vue+Vuex store的modules下,如何让this指向vue实例?
- 【笔记】vue中引用了其他组件 (比如Bus.js),如何使this重新指向当前组件?
- Vue-cli项目中引入外部/第三方css/js/less文件具体步骤
- vue2.0 使用vue-cli搭建的项目如何在index.html里引入静态css和js
- 如何在其他js 引入main.js 中 vue 的实例?
- 挖坑指南:如何在引用的外部js文件中获取vue页面实例?(独家)
- Vue项目中引入外部文件的方法(css、js、less)
- Vue项目中如何引用外部js
- vuejs搭建的项目如何引入图标字体
- vue-cli快速构建项目>>>>及引入jquery、jquery插件、this的指向 mounted钩子函数应用
- vue项目中引入外部css以及js文件的方法
- 如何利用vue-cli和webpack搭建vuejs项目
- vue学习如何引入js,封装操作localStorage本地储存的方法
- 【vue】如何在 Vue-cli 创建的项目中引入 iView
- js 函数作用域与this 的指向实例
- vue项目打包之后静态资源不显示问题及如何让webpack不打包某个静态资源(js,css,img)
- 怎么(如何在CODEIGNITER中)在CI中引入外部的JS与CSS呢?
- vue 中使用阿里iconfont (含有彩色图标,引入外部js文件)
- 【Vue】项目打包的时候,build.js文件过大,可以通过设置懒加载或者按照路由分模块加载进行打包