Home > Web Front-end > Vue.js > body text

How to reference vue in .js file

藏色散人
Release: 2023-01-13 00:44:56
Original
8376 people have browsed it

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) {
      
    },
Copy after login

2. Then in main.js: execute the initContext method exported by http.js

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

Recommendation: "vue tutorial"

Two methods:

1. Main.js exports vue instance:

var vue = new Vue({
  el: '#app',
  router,
  components: { App },
  template: ''
})
export default vue
Copy after login

2. Introduce

import context from '../main.js'
context.$router.push('/login')
Copy after login

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!

Related labels:
vue
source:php.cn
Statement of this Website
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 [email protected]
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template
About us Disclaimer Sitemap
php.cn:Public welfare online PHP training,Help PHP learners grow quickly!