React第一次渲染准备ajax数据。正常是render之后才ajax,通过改变state进行重新渲染
思路:1、在状态state中设置一个开关变量;2、在render中把要渲染的组件(假设组件B)定义到return外面3、在第一次render的时候,通过开关判断是否需要渲染所以,第一次render的时候,开关是关的,就不进行组件B的渲染,当componentDidMount后,获取ajax返回数据,再改变state的状态,进行重新render思路是条件渲染,设置一个判断条件,条件值不同,渲染的组件
·
思路:
1、在状态state中设置一个开关变量;
2、在render中把要渲染的组件(假设组件B)定义到return外面
3、在第一次render的时候,通过开关判断是否需要渲染
所以,第一次render的时候,开关是关的,就不进行组件B的渲染,当componentDidMount后,获取ajax返回数据,再改变state的状态,进行重新render
思路是条件渲染,设置一个判断条件,条件值不同,渲染的组件不同,下面是官网的一个例子
class LoginControl extends React.Component {
constructor(props) {
super(props);
this.handleLoginClick = this.handleLoginClick.bind(this);
this.handleLogoutClick = this.handleLogoutClick.bind(this);
this.state = {isLoggedIn: false};
}
handleLoginClick() {
this.setState({isLoggedIn: true});
}
handleLogoutClick() {
this.setState({isLoggedIn: false});
}
render() {
const isLoggedIn = this.state.isLoggedIn;
let button = null;
if (isLoggedIn) {
button = <LogoutButton onClick={this.handleLogoutClick} />;
} else {
button = <LoginButton onClick={this.handleLoginClick} />;
}
return (
<div>
<Greeting isLoggedIn={isLoggedIn} />
{button}
</div>
);
}
}
ReactDOM.render(
<LoginControl />,
document.getElementById('root')
);
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐


所有评论(0)