Home  >  Article  >  Web Front-end  >  How to reference vue in .js file

How to reference vue in .js file

藏色散人
藏色散人Original
2020-12-14 10:58:058598browse

Methods to reference vue in js files: 1. Define a variable context to receive vue, and then execute the initContext method exported by http.js; 2. Create a main.js export vue instance, and then use it in the Just introduce the example into js.

How to reference vue in .js file

The operating environment of this tutorial: windows7 system, vue2.0 version, thinkpad t480 computer.

Refer to the vue instance in the js file

The first method:

1. First, in http.js: define a variable context for Receive vue, then set the parameter passed in to the initVue method to be vue, and export this method.

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. Then in main.js: execute the initContext method exported by http.js

var vue = new Vue({
    el: '#app',
    router,
    components: {App},
    template: &#39;<App/>&#39;
})
Vue.prototype.http = http
//挂载http的时候执行引入vue的方法
Vue.prototype.http.initContext(vue) // 传入vue实例

Recommendation: "vue tutorial"

Two methods:

1. Main.js exports vue instance:

var vue = new Vue({
  el: &#39;#app&#39;,
  router,
  components: { App },
  template: &#39;<App/>&#39;
})
export default vue

2. Introduce

import context from &#39;../main.js&#39;
context.$router.push(&#39;/login&#39;)

into the js that needs to be used. For more programming-related knowledge, please visit : Introduction to Programming! !

The above is the detailed content of How to reference vue in .js file. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Previous article:How to use vue amapNext article:How to use vue amap