反応jsのメインコンポーネントの認証

Question

meteor（v1.3）を使用してユーザーベースのアプリケーションを作成したいと考えています。したがって、認証と承認はアプリの核となる。 フロールータの作成者が書いたこの優れた例は、フ​​ロールータで認証と認可を行う方法を説明しています。

https://github.com/alanning/meteor-roles/tree/master/examples/flow-router-advanced ただし、この例では、デモンストレーションにBlazeを使用しています。私はそれが可能であることを知りたいと思います反応と同じことを行う。

反応するように私にとって最も難しいのは、テンプレートレベルでサイト全体の認証を行うことです。この時点で、私はそれがどのように反応するのか分かりません。

レッツは、私はメインのレイアウト・コンポーネントを持っていると言う：

export const MainLayout = ({content}) => (

    <div className="container"> 

       {content} 

    </div> 
); 

私はこのレイアウトで認証を行うことができますどのように？ しかし、私はルータでそれを行うことができますが、フロールータの全体のポイントは非反応性であり、予測可能です。フロールータの作成者は、上記の例と同様に、テンプレートレイヤでもこれを行うことを推奨しました。

リアクションは私にとって新しいものです。私はリアクションという概念を誤解しているかもしれません。したがって、あなたがこれが理想的な方法ではないと思うなら、私を正しい道に導いてください。

Answer 1

createContainer機能を使用、流星1.3以降でコンポーネントを反応させるために流星の反応変数をバインドするには：

export const MainLayout = createContainer(() => { 
    return { 
    isAdmin: Roles.userIsInRole(Meteor.userId(), ['admin']), 
    userName: Meteor.user() ? Meteor.user().username : null 
    } 
}, (props) => { 
    if (!props.isAdmin) { 
    return <p>No cake for you.</p> 
    } 
    return <div className="container"> 
    <p>Hello {props.userName}</p> 
    {props.content} 
    </div>; 
}); 

createContainerは、あなたが提供するコールバック関数の戻り値とpropsオブジェクトを拡張します。その機能の無効な値（上記のMeteor.user()など）にアクセスすると、その値が変更されるたびに再評価されます。ブラウザのコンソールに「Meteor.logout()」と入力し、コンポーネントが即座に反応するのを確認します。

本格的なチュートリアルについては、https://www.meteor.com/tutorials/react/collectionsをご覧ください。