Question

您有一个使用react和redux的应用程序。假设你有两个React组件，组件A和组件B.组件B是组件A的子类。此时一切正常。但是，现在有必要使用mapStateToProps和react-redux的connect方法访问组件A中的状态。您刷新页面，应用程序崩溃时出现以下错误Cannot read property 'store' of undefined: TypeError: Cannot read property 'store' of undefined at ComponentB.Connect。您检查日志，并从组件B的构造函数中抛出错误，即super(props)方法。

您已尝试过以下操作：

在两个文件中使用contextTypes。
让组件B使用与组件A相同的代码访问状态。

在这种情况下可能会出现cannot access property store of undefined错误的问题？

以下是一些涉及的代码：

注册/ index.js

import SignUp from './SignUp';
import {connect} from 'react-redux';
import * as selectors from '@@store/selectors';

const mapStateToProps = state => {
    const activeSite = selectors.getActiveSite(state);
    const domain = activeSite.properties.domain;
    return {
        domain
    };
 };

 export default connect(mapStateToProps)(SignUp);

注册/ Signup.js

class SignUp extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      email: '',
      buttonDisabled: false,
      signUpState: 'new',
      newsletterStatus: 'Enter Your Email Address'
    };
    const {accounts} = config.get('campaignMonitor');
    this.list = accounts[this.props.domain].source;
    this.channelName = '';
  }

  set(property, value) {
    this[property] = value;
  }

  invalid() {
    this.setState({
      buttonDisabled: false,
      email: '',
      newsletterStatus: 'Please enter a valid email.'
    });
  }
  ....rest of methods, props validation, etc.

通讯/ index.js

import React from 'react';
import SignUp from '@@modules/SignUp';
import * as selectors from '@@store/selectors';
import config from '@@config';
import './styles';

class Newsletter extends SignUp {
  constructor(props) {
    super(props); <----- HERE IS WHERE THE ERROR IS BEING THROWN
    const {accounts} = config.get('campaignMonitor');
    super.set('list', accounts[someRandomString].source);
  }

  render() {
    ....rest of methods, props validation, etc.

父类访问状态时，Subclassed React Component抛出错误

0 个答案: