如果 child 使用 vue.js 调用 Axios 请求，如何触发 <b-overlay>

Question

如果 child 发出请求，如何触发 Bootstrap-vue 覆盖使用公理。我想自动执行此操作，我只需要一个触发覆盖的请求。

 <b-overlay>
   <child>
     <other-child />
   </child>
 </b-overlay>

Answer 1

就像@slowFooMovement 在评论中所说的那样，您可以将 axios 实例配置为在请求中具有 request/response 拦截器，您会将应用程序状态更改为正在加载，并在响应中设置它不加载。

这是一个基本示例https://codesandbox.io/s/interesting-leakey-deqr6?file=/src/components/FilmList.vue

Answer 2

还有另一种选择，您可以使用 Vuex 定义用于管理您的应用程序的全局状态。当然，如果您的项目很小，使用 $emit 可能是更好的解决方案。

有一个示例代码可以让您了解 Vuex 的主要思想，您需要根据您的情况对其进行扩展。

const store = new Vuex.Store({
    state: {
        is_loading: true
    },
    mutations: {
        changeIsLoading(state, value) {
            state.is_loading = value
        },
    }
})

如果 child 使用 vue.js 调用 Axios 请求，如何触发 <b-overlay>

How to trigger <b-overlay> if child calls an Axios request using vue.js

typescript

vue.js

axios

bootstrap-vue