Question

任何人都可以帮我弄清楚我的组件在发送后没有更新的原因吗？

count($data['results']) > 0

只需从Redux商店进行简单的条件渲染，我希望显示额外的div来通知用户他已经过身份验证，但它不会渲染。

在Redux异步教程中，AsyncApp示例中使用了这种类型的条件呈现示例，因此我不确定它为什么不起作用。调度我的操作，reducers成功更新状态，将其传递给连接的组件。这是我的减速器：

function mapStateToProps(state) {
     const { isAuthenticated } = state
     return { isAuthenticated }
}

class LoginForm extends Component {

 handleSubmit(event) { 
        event.preventDefault();
        const { dispatch } = this.props
        const credentials = this.state
        dispatch(attemptLogIn(credentials)); 
}


//    Dispatch works properly when API validates Login:
//               Redux Log:  
//                nextState:{ authReducer: {isAuthenticated: true}}

render() {
    const { isAuthenticated } = this.props;
        return (
  <div>
    { isAuthenticated && <div> Authenticated: True </div> } 
                         // Does not render even after dispatch

      <form onSubmit={this.handleSubmit}>
     {... Form Stuff ...}
      </form>
    </div>
  )
}

export default withRouter(connect(mapStateToProps)(LoginForm))

有谁知道为什么我的Component不会重新渲染？

Answer 1

将mapStateToProps函数更改为此。

function mapStateToProps(state) {
 const { isAuthenticated } = state.authReducer;
 return { isAuthenticated };
}

从Redux Store更新后，React Component无法重新呈现

1 个答案: