2016-11-02 5 views
0

私はリアクションコンポーネントをデータフェッチラッパーでラップするために反応コマーサーを使用しています。Javascript ES6で複数のラッパー関数をエクスポート

これは非常に基本的なもので、Meteorに複数のコンポーネントをラップしたいと思っています。しかし、私は輸出パターンが何であるか把握できません。ここで

は、私が持っているものである(と私に「予期しないトークン」エラーできます - あなたもこれを理解していれば、おそらく明らかに!):

// myContainer.jsx 
import Component1 from './Component1.jsx'; 
import Component2 from './Component2.jsx'; 

function composer(props, onData) { 
    if (Meteor.subscribe('SingleTodoLists').ready()) { 
    const todoList = todoLists.find({}).fetch(); 
    onData(null, { todoList }); 
    } 
} 

export composeWithTracker(composer, Loading)(Component1); 
export composeWithTracker(composer, Loading)(Component2); 

そして、私はこのようにそれらをインポートしたいと思います:

import { Component1, Component2 } from './myContainer.jsx'; 

このラッパーの構文は私にとっては明らかではありませんので、何を試してよいか分かりません。輸出のデフォルトと他のバリエーションを使用して遊んでもこれまでのところ結果は得られませんでした。

答えて

0

デフォルトの輸出を使用しない場合、あなたはエクスポート物事に名前を付ける必要があります。

export const TrackedComponent1 = composeWithTracker(composer, Loading)(Component1); 
export const TrackedComponent2 = composeWithTracker(composer, Loading)(Component2); 

あなたの代わりに、デフォルトのエクスポートを使用している場合は、例えば、名前を省略することができます

export default composeWithTracker(composer, Loading)(Component1); 

しかし、あなたは唯一のES6輸出構文については、マニュアルを参照してくださいモジュール

ごとにデフォルトのエクスポートを定義することができます。https://developer.mozilla.org/en/docs/web/javascript/reference/statements/export

更新:あなたは、元のを維持したい場合は

エクスポート名:

import _Component1 from './Component1.jsx'; 
import _Component2 from './Component2.jsx'; 

//... you code here 

export composeWithTracker(composer, Loading)(_Component1); 
export composeWithTracker(composer, Loading)(_Component2); 

Component1.jsxはデフォルトのエクスポートを使用するため、インポートするときに名前を変更できます(例: _Component1、UntrackedComponent1、...)。デフォルトのエクスポートがなければ、import { Component1 } as _Component1を代わりに使用できました。

+0

素晴らしい!本当に必要なわけではありませんが、実際には 'Component1'と' Component2'というオリジナルの名前を使う方法はありませんか?私は一時変数を使用して、エクスポートでComponent1と2を再割り当てすることができますが、それは本当にきれいではありません。 –

+0

はい、私の更新プログラムの回答を見ることができます:) –

関連する問題