1.在寫項目的時候，由于組件封裝的層次超過了兩層，因而想起了用provide和inject傳值的方式。provide和inject都是與data、methods、鉤子函數同級,千萬不要寫錯！！

基礎用法如下：

父組件中：

provide() {return {parent: this.parent,}},

孫組件中：

provide應該是 一個對象或返回一個對象的函數。 該對象包含可注入其子孫的屬性。

---------------------------------------------------------------------------------------------------------------------------------

項目中實際運用到的地方：

父組件中發起請求，從后端獲取到數據，將獲取到的數據傳遞到孫組件中，父組件獲取到數據賦值給變量

1.開始寫法如下：

父組件中：

?

?孫組件中：

?孫組件中打開調試工具，我們可以發現inject和data中定義的變量都是一個空數組，究其原因，就是因為父組件中是異步獲取到數據，當數據還沒有獲取到的時候，就已經通過provide傳遞到孫組件中，所以此時，我們需要將父組件中獲取到的數據進行包裝，再傳遞到孫組件中

2.經過包裝之后

?父組件中：

父組件異步獲取到數據，將數據進行簡單的處理。如下：

?

?孫組件中：

此時在孫組件中，我們可以看到調試工具中，provide和inject接受到的是一個函數

?使用的時候，直接調用整個函數即可拿到想要的數據

總結

以上是生活随笔為你收集整理的关于组件之间使用provide和inject传值的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。