provide 与 inject

• 作用：实现祖与后代组件间通信
• 套路：父组件有一个 provide 选项来提供数据，后代组件有一个 inject 选项来开始使用这些数据

具体写法：

1.传递数据

1. 祖组件中：

   setup(){
   ......
   let car = reactive({name:'奔驰',price:'40万'})
   provide('car',car)
   ......
   }

2. 后代组件中：

   setup(props,context){
   ......
   const car = inject('car')
   return {car}
   ......
   }

   2.第三方类库

   通过provide提供echarts和axios,xx组件通过inject接收

   App.vue

import {provide} from 'vue'
import * as echarts from 'echarts'
import axios from 'axios'
// axios.defaults.baseURL = '/api' //前端跨域时配置
provide('echarts',echarts);
provide('axios',axios);

XX.vue

import {inject} from 'vue'
//获取echarts
let $echarts = inject('echarts')
let $http = inject('axios')