"withRouter" 和 redux 的 "connect()" 的问题

Question

我正在尝试使用我的 react-redux 应用程序实现 react-router，但我收到此错误消息：

Layout(...): Nothing was returned from render. This usually means a return statement is missing. Or, to render nothing, return null.

我从 redux 网站上复制粘贴了 tutorial 中的所有内容，并添加了我已经存在的使用 redux 的组件。

我的Layout.js:

import React from "react"
import { connect } from "react-redux"
import { withRouter } from 'react-router-dom'

import { fetchIdeas } from "../actions/ideasActions"

import Ideas from "../components/Ideas"


class Layout extends React.Component {
  componentWillMount() {
    this.props.dispatch(fetchIdeas())
  }

  render() {
    const { ideas } = this.props;
    return 
      <div>
        <h1>Test</h1>
        <Ideas ideas={ideas}/>
      </div>
  }
}

export default withRouter(
  connect((store) => {
 return {
   ideas: store.ideas,
 };
  })(Layout)
)

我到底做错了什么？我找不到我的错误。

Answer 1

经典 JavaScript 错误。 return 不能这样独占一行。

return // returns undefined
  <div>
    <h1>Test</h1>
    <Ideas ideas={ideas}/>
  </div>

修复！

return (
  <div>
    <h1>Test</h1>
    <Ideas ideas={ideas}/>
  </div>
)

"withRouter" 和 redux 的 "connect()" 的问题

Problems with "withRouter" and redux's "connect()"

javascript

reactjs

react-router

react-redux

react-router-v4