javascript - setState 更改后元素未更新

Question

我是 reactjs 的新手。

在这里，我试图在按钮上显示一个微调器，就像

<button type="submit"
    style={{ fontWeight: 'bold', marginTop: 10 }}
    className="btn btn-primary btn-block"
    onClick={(event) => this.handleClick(event)}>
        {<i class="fa fa-spinner fa-spin"></i> && this.state.isloading}
        Login
</button>

现在，这里，

constructor(props) {
    super(props);
    this.state = {
        userName: '',
        passWord: '',
        isloading: false
    }
}

componentWillReceiveProps(newProps) {
    if (newProps.clickedLogin) {
        this.setState({
            isloading: true
        });
    }
}

因此，当用户单击按钮时，我将分派(dispatch)一个操作，然后我将使用 mapStateTOProps 获得一个 Prop 。

但是现在，当我点击按钮时，它并没有显示微调器。

谁能帮我解决这个问题？

Answer 1

你需要改变

{<i class="fa fa-spinner fa-spin"></i> && this.state.isloading}

到

{this.state.isloading && <i class="fa fa-spinner fa-spin"></i>}