在頂層，我有一個MainWrapper組件。如果用戶數據尚未到達，則顯示加載;如果沒有用戶，則顯示登錄/註冊;如果有全部用戶數據，則顯示實際頁面。

這是爲了防止使用Meteor.user（）的組件，並且它在數據到達之前重新呈現之前的一小段時間內未定義。

所以，到真正的問題：

這是MainWrapper的底部。

export default createContainer(() => { 
    return { 
     user: Meteor.user(), 
    }; 
}, MainWrapper);

每個用戶帳戶的文件有名字配置文件屬性，朋友，通知等於是我需要周圍的App這個數據相當多。

對我來說最好是將用戶從MainWrapper作爲道具傳遞下來？

或者我應該訂閱每個需要它的組件的數據嗎？（或者我甚至需要訂閱？如果組件只有一次加載MainWrapper確保用戶可用，那麼我可以在沒有額外開銷的情況下在組件中使用Meteor.user（）？）

任何幫助將不勝感激！

來源

2017-03-16 mildrenben

這個問題具體到'流星'，還是你只是問你需要怎麼做？在'react'中正確的方法？ –

好問題！

一般來說你想知道如何管理你的應用程序狀態。有州管理庫（Flux，Redux等）。他們處理你的狀態，你的組件訂閱了狀態的變化。

它是我最好的向下傳遞用戶從MainWrapper的道具？

這樣做，你必須將道具傳遞給每個孩子的組件。想象一下你有A→B→C→D分量。

如果您想將用戶對象從A傳遞給D，那麼您必須確保B和C同時通過。這很容易出錯，因爲你很容易忘記長時間傳遞它。然而，這裏最大的問題在於你將所有組件依賴於用戶對象。想象一下你想在別的地方重用B組件，但是它對用戶對象是不依賴的？

如何正確管理狀態，結果我的組件是可重用的？

讓我們使用Redux例如（我有它的經驗）。您可以將組件分爲Presentational和Containers。簡而言之，演示組件未訂閱Store（您的州），您可以在任何地方重複使用它們。另一方面，容器組件被存儲到商店中，並將道具傳遞給包含的子代表性組件。

這裏有一些很好讀取有關表象&集裝箱組件：

結論

所以成分分離的思想可以流星實現了。例如，您的Meteor應用程序將充當API，而Redux將處理前端應用程序邏輯和狀態。有不同的實現。這是一個good read如何將流星中的Redux集成在一起。

當然，您可以跳過Redux（或任何其他狀態庫）並使用Meteor工具集實現組件分離。

請記住，我的回答是反應& Redux經驗豐富，給你一個通用的想法，你如何更好地組織你的組件。

來源

2017-03-20 09:28:27

我不認爲有一個開銷在客戶端上調用Meteor.user()（but let's double check）有一個肯定的服務器上，因爲這會查詢數據庫，但除非你做服務器端渲染，這不是一個問題。所以，如果被定義取決於你Meteor.user()部件一旦用戶加載只呈現，你可以查詢Meteor.user()需要時

。
另一種方法是使用React context來傳遞此信息。該文檔列出了一些警告，並說這是一個實驗性功能。我一直在使用它一段時間，我對它很滿意。它是爲了解決@Jordan提到的問題，當你有一個組件的列表必須通過父母的道具給他們的孩子。這看起來像：

。

export class MainWrapper extends Component { 
    // specify some properties to make available to all descendant 
    getChildContext() { 
    return { 
     currentUser: Meteor.user(), 
    }; 
    } 
} 
MainWrapper.childContextTypes = { currentUser: PropTypes.object }; 


class SomeComponent extends Component { 
    render() { 
    const user = this.context.currentUser; 
    ... 
    } 
};

其實我更喜歡第二種方法，因爲它分離以及從數據相關的UI，使你更容易的組件來測試，例如流星上下文。這是由你自己決定是否需要減少。

更一般地，您可能希望查看分隔UI角色/數據狀態角色中的反應對象的容器/組件結構。如果你這樣做，你應該確保在容器部件中取出Meteor.user()。我很推薦它。 React Komposer使您可以輕鬆完成任務，並讓您指定要在加載數據時呈現佔位符組件：1,2。您可能也會對my fork感興趣，專門處理React上下文，但與主回購並不完全一致。

來源

2017-03-20 20:12:55 Guig

當前用戶的流星應用程序數據結構？

回答

如何正確管理狀態，結果我的組件是可重用的？

結論

相關問題