Regarding issues related to Vue.use in axios

This article mainly introduces to you the relevant information about the inability to use Vue.use() in axios. The article introduces it in detail through the example code. It has certain reference learning value for everyone's understanding and learning. Friends who need it can Reference

Preface

I have been learning axios recently and encountered some problems during use. I feel it is necessary to share with everyone, about For the basic knowledge of axios, you can refer to this article: Basic introductory usage tutorial of axios. I won’t say much below, let’s take a look at the detailed introduction.

Question

I believe many people will use Vue.use()## when using Vue to use other people’s components. # . For example: Vue.use(VueRouter), Vue.use(MintUI). But when using axios, you don’t need to use Vue.use(axios), you can use it directly. Then why is this?

Answer

Vue.use() , that is, a component with install. You will understand it after reading this.

Define components

Project directory

1. Create the folders and files as shown below

2. Define a component in Loading.vue

<template>
 <p class="loading-box">
 Loading...
 </p>
</template>

3.Introduce Loading.vue into jndex.js and export

// 引入组件
import LoadingComponent from './loading.vue'
// 定义 Loading 对象
const Loading={
 // install 是默认的方法。当外界在 use 这个组件的时候，就会调用本身的 install 方法，同时传一个 Vue 这个类的参数。
 install:function(Vue){
 Vue.component('Loading',LoadingComponent)
 }
}
// 导出
export default Loading

4.Introduce the index under the loading file in main.js

// 其中'./components/loading/index' 的 /index 可以不写，webpack会自动找到并加载 index 。如果是其他的名字就需要写上。
import Loading from './components/loading/index'
// 这时需要 use(Loading)，如果不写 Vue.use()的话，浏览器会报错，大家可以试一下
Vue.use(Loading)

5. Write the defined component tag

<template>
 <p id="app">
 <h1>vue-loading</h1>
 <Loading></Loading>
 </p>
</template>

Vue.use(axios) is because the developer did not write the install step when encapsulating axios. As for why it was not written, that is unknown.

How to implement multiple file downloads in WeChat applet

Explain the Object object in JS in detail

How to use vue.js to realize that the pop-up box only bounces once

Detailed interpretation of the trie prefix tree in javascript

Detailed interpretation of todoMVC code in Vue

The above is the detailed content of Regarding issues related to Vue.use in axios. For more information, please follow other related articles on the PHP Chinese website!