Question

我在A类中进行Ajax呼叫。收到响应后，我将更新存储。

class A {
    $.ajax({
        url
        success: (response) => {
            if (responseData !== null) {
                storage.set('view', true);
            } 
        },
        error: (jqXHR, status, error) => {
            console.log('error');
        }
    });
}

还有另一个B类，其中我已将此存储置于状态下。

class B extends React.Component {
    constructor(props) {
        super(props);
    }

    componentDidMount() {
        this.setState({
            view: storage.get('view')
        });
    }

    render() {
        return (
            <div className="test"></div>
        );
    }
}

如果A类中的Ajax调用不为null，但我没有发生，我希望B类重新呈现。任何帮助表示赞赏！

Answer 1

与redux共享反应组件：

 class Login extends Component {
    handleSubmitForm = ({values}) => {
       fetch("http://server.com/login", fetchData).then(
        response.json().then(response => {
        setUserDetails(response); // this function save to redux
      })        
    }
    render() {
      return <button onClick={this.handleSubmitForm} />
    }
 }
 export Login;

 class B extends Component {
  render() {
      return <div>running when props changes</div>
  }
 }
 // this is the redux mapping - will cause to class B to re-render when redux 
 // User Details changes
 const mapStateToProps = (state) => ({
   userDetails: state.userDetails
 });
 export default connect(mapStateToProps, null)(B);

包含存储数据的状态不会随着存储数据更改而重新呈现

1 个答案: