在vue项目中的js文件里使用vue实例
参考的网址:https://blog.csdn.net/weixin_34353714/article/details/86958742
不为其他,就为了记录一下,方便以后查看:
第一种方法:
1、首先在http.js中:定义一个变量context用来接收vue,再定一个initVue方法传入的参数是vue,并导出这个方法。
import axios from 'axios'
const TIME_OUT_MS = 60 * 1000 // 默认请求超时时间
let context = null // 定义一个变量,用来代替this(vue)
function handleResults (response) {
context.$router.push('/login')
return result
}
export default {
// 写一个此文件引入vue的方法,然后export导出去
initContext (vue) {
context = vue
},
post (url, data, response, exception) { },
2、然后在main.js中:执行http.js导出的initContext方法
var vue = new Vue({
el: '#app',
router,
components: {App},
template: '<App/>'
})
Vue.prototype.http = http
//挂载http的时候执行引入vue的方法
Vue.prototype.http.initContext(vue) // 传入vue实例
第二种方法:
1、main.js导出vue实例:
var vue = new Vue({
el: '#app',
router,
components: { App },
template: '<App/>'
})
export default vue
2、在需要使用的js中引入
import context from '../main.js'
context.$router.push('/login')
我选择了使用第二种方法;
在vue项目中的js文件里使用vue实例的更多相关文章
- 在被vue组件引用的 js 文件里获取组件实例this
思路: 通过调用函数 把 组件实例this 传递 到 被应用的 js文件里 实例: 文件结构 在SendThis.vue 文件中引用 了modalConfig.js import modalConf ...
- 在普通js文件里引入vue实例的方法
首先是我是写了一个 Loading 插件然后 是挂在打vue.prototype 原型上的. 在main.js中use使用了这个插件. 至此vue原型是就被我挂上 $loadding方法了. 然后我想 ...
- Vue 项目中对路由文件进行拆分(解构的方法)
项目需求场景: 在开发项目过程中,在项目过于庞大,路由信息非常多的情况下,如果将路由配置信息都放在一个文件里面,那么这个JS是不方便维护的, 那么,这个时候需要我们把这个庞大的路由文件,根据项目功能分 ...
- Vue项目中引入外部文件(css、js、less)
例子中css文件采用bootstrap.css,js文件采用jQuery,less文件用less.less(自定义文件) 步骤一:安装webpack cnpm install webpack -g 步 ...
- vue-cli构建的vue项目中引入stylus文件
在写基于vue-cli的vue项目时,如果直接引入styl文件,会报错,需要安装stylus.stylus-loader依赖以及别名配置. 1.下载安装stylus.stylus-loader,推荐使 ...
- 向MyEclipse的项目中导入js文件时,出现小红叉
这个问题困扰我很久.刚开始时,也没有解决,因此也在网上寻找解决方法,还是没能解决.最近做项目时再一次出现了这样的问题,于是决定还是再找找办法.在此,分享一下自己的解决方法,给正处于痛苦中的童鞋们带来解 ...
- vue项目中导出Excel文件功能的前端代码实现
在项目中遇到了两种不同情况, 1.get请求导出文件,实现起来相对简单 // 导出数据 exportData() { window.location.href = `/oes-content-mana ...
- Vue项目中导入excel文件读取成js数组
1. 安装组件 cnpm install xlsx --save 2. 代码 <template> <span> <input class="input-fil ...
- vue项目中操作PDF文件
以前从来没接触过前端要求显示PDF文件,一时之间有点懵逼,不知从哪下手啊... 无奈之下,去找度娘,方法还不少,iframe embed object这些标签就可以, 可是拿过来做个demo一试, ...
随机推荐
- git 本地代码 切换远程分支
公司之前代码使用的是gitlab,后来换成腾讯的工峰,所以需要切换远程不支,所以在原代码上切换即可. 在原项目打开git bash命令,打开后会显示本地的原始分支 打开后 添加新的远程分支,红色字体为 ...
- CODING 敏捷看板全新上线,助力研发管理可视化升级
在服务企业研发团队的过程中,我们发现不少团队碰到了类似的问题: 团队成员声称完成了自己的大部分任务,但团队实际交付的需求却寥寥无几? 由于某些问题导致工序一直处于等待状态,怎么识别和处理这些延迟? 成 ...
- leetcode菜鸡斗智斗勇系列(3)--- Jewels and Stones珠宝和钻石
1.原题: https://leetcode.com/problems/jewels-and-stones/ You're given strings J representing the types ...
- 第2章:C++泛型机制的基石:数据类型表——《C++泛型:STL原理和应用》读书笔记整理
第二章:C++泛型机制的基石--数据类型表 2.1 类模板的公有数据类型成员 2.1.1 类的数据类型成员 C++类中不仅可以定义数据成员和函数成员,而且还可以定义数据类型成员.在泛型设计中,类的 ...
- .net core 3.0web_razor page项目_使用中间件接受大文件上传报错_httpRequest.Form threw an exception of type Microsoft.AspNetCore.Server.Kestrel.Core.BadHttpRequestException_Request body too large
前言:在web项目的.net framework时文件上传时,自己常用一般处理程序接受上传文件,上传文件的大小限制是可以项目的webconfig里配置. 到core项目使用一般处理程序变成了中间件 ...
- Consul初探-服务注册和发现
前言 经过上一篇的学习,现在已经来到了服务注册发现环节:Consul 的核心功能就是服务注册和发现,Consul 客户端通过将自己注册到 Consul 服务器集群,然后等待调用方去发现服务,实现代理转 ...
- PHP 字符串大全
PHP字符串函数是核心的一部分.无需安装即可使用这些函数 函数名称 描述 addcslashes 以 C 语言风格使用反斜线转义字符串中的字符 addslashes 使用反斜线引用字符串 bin2he ...
- dpwwn:2 Vulnhub Walkthrough
此镜像配置了静态IP地址:10.10.10.10,需要调整下网络 主机层扫描: ╰─ nmap -p1-65535 -sV -A 10.10.10.10 80/tcp open http ...
- 设置tabBar的图片/高度/title颜色
实现了一下内容: 1.设置tabBarItem选中及非选中时的图片,图片充满item; 2.调整了 tabBar 高度; 3.改变了title颜色及位置. ------------代码如下: ---T ...
- git命令行的颜色配置
Git颜色branch,diff,interactive,status配置,git终端配置颜色,git命令行高亮 Git默认的输出是单一颜色的,感觉很不容易阅读,Git支持用多种颜色来显示其输出的信息 ...