reactjs - 调度操作后 react Redux setState

Question

这是我在 React 中使用 Redux 进行状态管理的 EditStudent 组件。这是我的组件代码。

import React, { Component } from 'react'
import {connect} from 'react-redux';
import {getStudentDetail} from '../actions/studentActions';

class EditStudents extends Component {
    constructor(props){
        super(props);
        this.onInputChange = this.onInputChange.bind(this);
        this.state = {
            name:this.props.student.name,
            email:this.props.student.email,
            address:this.props.student.address
        }
        // this.state

    }

  render() {    
    return (
      <div>
      <form>
              <p>
                 <label>Name</label>
                 <input type="text" name="name" 
                 value={this.state.name} 
                 onChange={this.onInputChange}
                />
              </p>
              <p>
                 <label>Email</label>
                 <input type="text" name="email" 
                 value={this.state.email} 
                 onChange={this.onInputChange}
                 />
              </p>
              <p>
                 <label>Address</label>
                 <input type="text" name="address"
                  value={this.state.address} 
                  onChange={this.onInputChange}
                  />
              </p>
            <button type="submit">Update</button>
          </form>

      </div>
    )
  }
  onInputChange(e){
      var name = e.target.name;
    this.setState({[name]:e.target.value});

  }

  componentDidMount(){
      this.props.getStudentDetail(this.props.studentId());
  }
}

let mapDispatchToProps = (dispatch,ownProps)=>{
    return {
        getStudentDetail: (id)=>{
            dispatch(getStudentDetail(id));
        },
        studentId: ()=>{
            return ownProps.match.params.id;
        }

    }
}

const mapStateToProps = (state)=> {
    return {
        student:state.students.student
    }
}


export default connect(mapStateToProps,mapDispatchToProps)(EditStudents);

我在文本输入字段中显示 ajax 响应时遇到问题。我在构造函数中设置组件，但是没有设置 ajax 请求完成状态。

ajax完成后是否可以设置状态？

Answer 1

我通过在组件上添加 componentWillReceiveProps() 函数来解决它。

componentWillReceiveProps(nextProps){
    this.setState({
        name:nextProps.student.name,
        email:nextProps.student.email,
        address:nextProps.student.address
    })
  }

非常感谢，Sakhi Mansoor 的帮助。