javascript - 未捕获的类型错误 : Cannot set property propTypes of function Settings(props)

Question

prop 类型在正常的 React 组件中工作正常，但在 Redux 连接的组件中失败。

错误详情

Uncaught TypeError: Cannot set property propTypes of function Settings(props)

完整的错误详情

Uncaught TypeError: Cannot set property propTypes of function Settings(props) { _classCallCheck(this, Settings);

var _this = _possibleConstructorReturn(thi...<omitted>... } which has only a getter
at Object.eval (Settings.js?384b:533)
at eval (Settings.js:509)
at Object../src/Navigation/Components/Settings.js (main.b2f70c3c5e2d43b8884a.js?b2f70c3c5e2d43b8884a:14403)
at __webpack_require__ (main.b2f70c3c5e2d43b8884a.js?b2f70c3c5e2d43b8884a:725)
at fn (main.b2f70c3c5e2d43b8884a.js?b2f70c3c5e2d43b8884a:102)
at eval (routes.js?5665:15)
at Object../src/routes.js (main.b2f70c3c5e2d43b8884a.js?b2f70c3c5e2d43b8884a:14763)
at __webpack_require__ (main.b2f70c3c5e2d43b8884a.js?b2f70c3c5e2d43b8884a:725)
at fn (main.b2f70c3c5e2d43b8884a.js?b2f70c3c5e2d43b8884a:102)
at eval (index.js?b635:2)

我正在使用 prop-types v15、react v16、react-redux v3 库。

Settings.js 组件:

import PropTypes from 'prop-types';
import { connect } from 'react-redux';
import React, { Component } from 'react';

class Settings extends Component {
constructor(props) {
    super(props);
}

static get propTypes() {
    return {
      loginId:React.PropTypes.string,
      loading: React.PropTypes.bool,  
      updateEmail: React.PropTypes.func
    }
  }

render(){
   return(
      <div>{this.props.text}</div>
   )
  }
}

function mapStateToProps(state) {
   let text = "Hello Settings";
   return {
      text
   }
}

Settings.propTypes = {
    loginId: PropTypes.string,
    loading: PropTypes.bool
  }

export default connect(mapStateToProps, null)(Settings);

Answer 1

mapStateToProps 用于将变量从 redux store 发送到 react 组件。

但是你只是用它来设置一个 Prop 。

但是，根据 Bartek 的评论，您可以尝试这样做:

const mapStateToProps = state => {
    return {
        text: "hello settings"
    }
}

你应该使用 mapStateToProps 的方式更像这样:

const mapStateToProps = state => {
    return {
        text: state.text
    }
}