あなたはどのように部分反応を起こすのですか

Question

私は反応の中で部分的なものを作り、使う方法を見つけようとしています。私は新しいページを作る方法を考え出しましたが、今では私のフッタを部分的に入れてページレイアウトに追加しようとしています。

私はページのレイアウトを持っている - 私はここにフッターを追加しようとしています：

import React from 'react' 
import { NavLink } from 'react-router-dom' 
import PropTypes from 'prop-types' 
import Logo from '../assets/logo.png' 
import '../styles/PageLayout.scss' 
var Footer = require('Footer'); 


export const PageLayout = ({ children }) => (
    <div className='container text-center'> 
    <NavLink to='/' activeClassName='page-layout__nav-item--active'><img className='icon' src={Logo} /></NavLink> 

    <div className='page-layout__viewport'> 
     {children} 
     <Footer /> 
    </div> 

    </div> 


    </div> 


) 
PageLayout.propTypes = { 
    children: PropTypes.node, 
} 

export default PageLayout 

その後、私は持っていFooter.jsコンポーネント/持っている：

import React from 'react'; 
import ReactDOM from 'react-dom'; 
// import { Button } from 'react-bootstrap'; 
import * as ReactBootstrap from 'react-bootstrap' 

class Footer extends React.Component { 

    render: function() { 
     return (
     testing 
    ); 
    } 
    } 

    module.exports = Footer; 

} 

これはエラーになりますがそれは言う：

ERROR in ./src/components/PageLayout.js 
Module not found: Error: Can't resolve 'Footer' in '/Users/me/code/learn-react-redux/src/components' 
@ ./src/components/PageLayout.js 26:13-30 
@ ./src/routes/index.js 
@ ./src/main.js 
@ multi ./src/main webpack-hot-middleware/client.js?path=/__webpack_hmr 

誰もがページレイアウトに部分を組み込む方法を知っていますか？そこには動的なものは何もありません。私はちょうど部分を抽出してファイルをきちんと整理しようとしています（そして悲惨に失敗しています）。

Answer 1

2つのフレーマーに2つのエラーがあります。

1. あなたのrender（）関数は、裸のテキストではなく要素を返す必要があります。すなわち<span>testing</span> NOT testingです。

2. あなたのエクスポートステートメントは、クラス定義内にあります。それを外に置きます。あなたの関数のシグネチャをレンダリング

3. UPDATEも間違って見えますrender() {

最後に、あなたの文を必要と読んでください。試してくださいrequire('./Footer')。