Question

在运行代码时出现以下错误，并且不确定从哪里开始调试。

mapStateToProps() in Connect(EquipmentMetadata) must return a plain object. Instead received undefined.
Warning: Failed prop type: The prop name is marked as required in EquipmentMetadata, but its value is undefined.

这是索引文件：



    import 'babel-polyfill'
    import React from 'react'
    import { render } from 'react-dom'
    // import Root from './containers/Root'
    import { setName } from './actions'
    // import createStore from './common/store/'
    import { Provider } from 'react-redux'
    import EquipmentMetadata from './containers/EquipmentMetadata'
    // import ReduxPiece from './components/ReduxPiece'
    import configureStore from './configureStore'

    const store = configureStore()

    window.EquipmentMetadata = {
      store,
      setName
    }

    render(
         <Provider store={store}>
         {/* <Root /> */}
            <EquipmentMetadata />
          </Provider>,
      document.getElementById('equipment-metadata')
    )




import 'babel-polyfill'
import React from 'react'
import { render } from 'react-dom'
// import Root from './containers/Root'
import { setName } from './actions'
// import createStore from './common/store/'
import { Provider } from 'react-redux'
import EquipmentMetadata from './containers/EquipmentMetadata'
// import ReduxPiece from './components/ReduxPiece'
import configureStore from './configureStore'

const store = configureStore()

window.EquipmentMetadata = {
  store,
  setName
}

render(
     <Provider store={store}>
     {/* <Root /> */}
        <EquipmentMetadata />
      </Provider>,
  document.getElementById('equipment-metadata')
)



equipmentmetadata.js

import React, { Component } from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import Greeting from '../components/Greeting'
// import ReduxPiece from "../components/ReduxPiece";

class EquipmentMetadata extends Component {
  render () {
    // const { name } = this.props

    return (
      <div>
      <Greeting 
        // name={name}
       />
     {/* <ReduxPiece /> */}
     </div>  
    )
  }
}

EquipmentMetadata.propTypes = {
  name: PropTypes.string.isRequired
}

function mapStateToProps (state) {
  // const { name } = state
  // return {
  //   name
  // }
}

function mapDispatchToProps (dispatch) {
  return {}
}

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(EquipmentMetadata)

Answer 1

它告诉您mapStateToProps应该返回某些内容-您已对所有内容全部进行了注释。如果您不希望它返回任何内容，则只需使其返回{}。另外，在注释掉它时，EquipmentMetadata在其propTypes中表示它需要一个名称道具，而您现在不发送该道具。

Answer 2

mapStateToProps必须是一个返回对象的函数。 mapStateToProps函数的符号可以如下所示。

//ES5
function mapStateToProps (state) {
  return {
    key: name of the reducer function
  }
}

//ES6
const mapStateToProps = (state) => ({
    key: name of the reducer function
})

对于您的代码，您可以尝试进行如下更改

function mapStateToProps (state) {
  return {
    name: state.nameOfReducer.valueinReducer
  }
}

Connect（EquipmentMetadata）中的mapStateToProps（）必须返回一个普通对象。而是收到未定义

2 个答案: