在擴展組件之間傳遞數據或組件的調用方法

Question

我有主要組件在Created()方法中獲取用戶列表。主要組件擴展了兩個組件。在這種情況下，創建的方法會在每次創建擴展組件時調用。所以我有額外的用戶訪問列表調用。目標是一次抓取用戶並將其傳遞給擴展組件。

例如：

https://jsfiddle.net/apokjqxx/45/

在示例中，我們可以看到，主要成分的Created()方法稱爲兩個時間，但需要一個時間和數據傳遞到擴展組件。什麼是最好的解決方案？

Answer 1

每個擴展組件都是一個不同的對象實例，這就是爲什麼Created()和fetch被執行兩次。

您需要的是另一段代碼，用作您的項目列表的存儲（緩存），這段代碼應該實例化一次並在您的組件之間共享。

Vuex可能是爲「一段代碼」一個不錯的選擇

Answer 2

如果您math和physics組件共享相同的數據，甚至有很多共同的模板，爲什麼不能讓他們一個組成部分？這將解決您的重複抓取的問題，你可以很容易地通過一個v-for包裹當前模板重新安排你的模板，並使用

data() { 
    return { 
     lists: [ 
      {course: 'math', people: ['mike', 'arnold', 'tony']}, 
      {course: 'physics', people: ['mike', 'arnold', 'tony']} 
     ] 
    }; 
} 

爲您的數據。