Question

我需要帮助。

我已经在StackOverflow（Similar Question）中找到了类似的问题

我已阅读并尝试找出我的代码可能存在的问题。作为开发人员，我有点新手，但我仍在学习如何调试代码，因此，如果答案突然出现在我面前，请对不起，但我确实需要在这里进行澄清。

我正在React-Redux中开发一个项目，当我尝试加载该应用程序时，它显示标题错误。

我怀疑错误出在我的App.js中。下面是部分代码：


class App extends Component {  

  resetActiveIndexToZero = () => {
    this.setState({ activeIndex: 0 })
  }

  componentDidMount() {
    const { handleInitialData } = this.props
    handleInitialData()
  }

  render() {
    const { isAuthenticated } = this.props    

    return (
      <BrowserRouter>
          <Fragment>
            <LoadingBar style={{ zIndex: 1000 }} />            
            {isAuthenticated && <Menu />}
            <div className='ui main text container' style={{ marginTop: '7em' }}>
              <Switch>
                <Route path='/' exact component={RequiresAuth(QuestionList)} />
                <Route path='/add' component={QuestionNew} />
                <Route path='/login' component={Login} />
                <Route path='/questions/:question_id' component={RequiresAuth(QuestionView)} />
                <Route path='/leaderboard' component={RequiresAuth(Leaderboard)} />                                                     
                <Route path='/logout' component={Logout} />                   
                <Route path='/404' component={PageNotFound} />                          
              </Switch>
            </div>
            <Footer />
          </Fragment>
      </BrowserRouter>         
    )
  }  
}

const mapStateToProps = (state) => {
    const { authedUser } = state
    return { isAuthenticated: authedUser !== null }
}

我尝试了一些事情，但没有成功。

此代码可能有什么问题？

有什么想法吗？

谢谢。

更新1

这是档案库RequiresAuth.js的代码，如以下答案中所述：


import React from 'react'
import PropTypes from 'prop-types'
import { connect } from 'react-redux'
import { Redirect } from 'react-router'

export default function (ComposedComponent) {
    class RequiresAuth extends React.Component {
        static propTypes = {
            isAuthenticated: PropTypes.bool            
        }

        render() {
            return (
                <div>
                    {this.props.isAuthenticated ? <ComposedComponent {...this.props} /> 
                    : <Redirect to={{ pathname: '/login', state: { referrer: window.location.pathname}}} />}                   
                </div>
            )
        }    
    }

    const mapStateToProps = (state) => {
        return {
            isAuthenticated: state.authedUser !== null
        }
    }    

    return connect(mapStateToProps)(RequiresAuth)

更新2

以下是代码和框：https://sit9d.csb.app/login

错误：“`最大更新深度超过`”

0 个答案: