你如何做出部分反应

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

然后我有一个 components/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

我在您的页脚中看到两个三个错误。

您的 render() 函数必须 return 一个元素，而不是纯文本。即 <span>testing</span> 不是 testing.
您的导出语句位于您的 class 定义中。放在外面。
更新你的渲染函数签名应该是render() {

最后，你的 require 语句看起来也有问题。试试 require('./Footer').

你如何做出部分反应

How do you make a partial in react

javascript

renderpartial

reactjs

react-redux