在vue项目中的js文件里使用vue实例

墨蓝 2021-11-22 04:52 491阅读 0赞

参考的网址：[https://blog.csdn.net/weixin\_34353714/article/details/86958742][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')

我选择了使用第二种方法；

转载于:https://www.cnblogs.com/wangtaolearning/p/11236266.html

[https_blog.csdn.net_weixin_34353714_article_details_86958742]: https://blog.csdn.net/weixin_34353714/article/details/86958742

发表评论取消回复

表情：

评论列表（有 0 条评论，491人围观）

还没有评论，来说两句吧...

相关阅读

相关 echarts在vue里使用

安装 npm install echarts --save 注册全局main.js import echarts from 'echarts'

「爱情、让人受尽委屈。」/ 2023年06月30日 05:28/ 0 赞/ 4 阅读

相关 Vue项目中，在filters中使用this（Vue实例对象）

效果图： ![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ub

男娘i/ 2023年01月18日 12:23/ 0 赞/ 175 阅读

相关在Vue 项目中动态引入 .js 文件

静态引入js文件： <template> <div> </div> </template> <

Myth丶恋晨/ 2022年12月01日 15:57/ 0 赞/ 608 阅读

相关 fabric.js绘图库在使用vue项目中使用

[原博地址][Link 1]，亲测有效！ ps：依赖js文件下载地址链接：https://pan.baidu.com/s/1E-QVuOh1JtuCPr0GRl52w

左手的ㄟ右手/ 2022年11月17日 03:52/ 0 赞/ 102 阅读

相关 vue中js文件里获取this（vue实例）

vue中js文件里获取this（vue实例） 1，在main.js中抛出vue实例，在需要用到的地方引入即可 main.js里 let vueThis= new Vue

我会带着你远行/ 2022年11月03日 11:38/ 0 赞/ 325 阅读

相关 js之websocket在vue项目中使用

websocket的大致作用：对于前端工程师来说，一般是前端通过触发事件，主动发起请求来获取后台数据。但是特定情况下，需要后端服务器主动推送数据到前端。这时候普通的a

素颜马尾好姑娘i/ 2022年10月23日 11:20/ 0 赞/ 214 阅读

相关在vue项目里使用Monaco Editor

项目中本来使用的是codemirror，但是index.html中需要引入很多js和css，使用起来感觉不太方便（可能是水平有限，用的不对） 1，安装monaco-edito

你的名字/ 2022年04月23日 05:54/ 0 赞/ 1873 阅读

相关在vue项目中的js文件里使用vue实例

参考的网址：[https://blog.csdn.net/weixin\_34353714/article/details/86958742][https_blog.csdn.

墨蓝/ 2021年11月22日 04:52/ 0 赞/ 492 阅读

相关在Vue项目中使用Three.js

Three.js 是什么？ Three.js是一款开源的主流3D绘图JS引擎（名字Three就是3D的含义）。Three.js 是一款运行在浏览器中的3D引

r囧r小猫/ 2021年10月19日 06:40/ 0 赞/ 618 阅读

相关应用在vue项目里的axios使用方法

1.首先要安装axios，在你项目目录下安装axios。在命令行里输入：npm install axios； 2.然后要在main.js的入口文件里引入以下代码；

桃扇骨/ 2021年06月24日 15:59/ 0 赞/ 531 阅读