ES6は、私は細かい作業よりも、このES6 + JSXコードを持って

Question

に失敗し、私は他のファイルにconstの成分を抽出することができますどのように反応する：

// list.js 
import React from 'react'; 
import { 
    List, 
    Datagrid, 
    Filter, 
    TextInput, 
    NumberField, 
    TextField, 
} from 'admin-on-rest/lib/mui'; 

const Filters = props => 
    <Filter {...props}> 
    <TextInput source="q" alwaysOn /> 
    </Filter> 
; 

export default props => (
    <List {...props} filters={<Filters />} > 
    <Datagrid> 
     <NumberField source="id" /> 
     <TextField source="description" /> 
    </Datagrid> 
    </List> 
); 

私は別のソースファイル内のフィルタの定義を抽出します。

私はこの方法を試してみました：

// filters.js 
import React from 'react'; 
import { 
    Filter, 
    TextInput, 
    TextField, 
} from 'admin-on-rest'; 

export default props => 
    <Filter {...props}> 
    <TextInput source="q" alwaysOn /> 
    </Filter> 
; 

と

// list.js 
import React from 'react'; 
import { 
    List, 
    Datagrid, 
    Filter, 
    TextInput, 
    NumberField, 
    TextField, 
} from 'admin-on-rest/lib/mui'; 
import Filters from 'filters'; 

export default props => (
    <List {...props} filters={<Filters />} > 
    <Datagrid> 
     <NumberField source="id" /> 
     <TextField source="description" /> 
    </Datagrid> 
    </List> 
); 

私はコードが同等だと思ったが、2番目のケースでは、私は

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in.

そして最後のカップルを取得このエラー

起訴主要は

filters={<Filters />} 

ですが、何が正しい構文でしょうか？

Answer 1

私の自己の答え：

私の愚かな間違い、私は間違っているモジュール（管理者・オン・休息の代わりに管理・オン・休憩/ libに/ MUIの）からいくつかのコンポーネントをインポートしようとしました。

この質問は、完全に誤解を招いたメッセージを考えれば便利かもしれませんが、StackOverflowから完全に削除する必要があります。