极客观点
项目管理
HarmonyOS
如下代码，LikeButton的动作如何操作LikeText的state？
或者调用changeLike方法？
新手求教。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv='Content-type' content='text/html; charset=utf-8'>
<title>TEST</title>
</head>
<body>
<h2>TEST</h2>
<div id="container"></div>
<div id="container2"></div>
<script src="http://reactjs.cn/react/js/react.js"></script>
<script src="http://reactjs.cn/react/js/JSXTransformer.js"></script>
<script type="text/jsx">
var LikeText = React.createClass({
getInitialState: function() {
return {liked: false};
},
changeLike: function() {
this.setState({
liked: !this.state.liked
})
},
render: function() {
var text = this.props.liked ? 'like' : 'haven\'t liked';
return (
<p>
You {text} this. Click btn to toggle.
</p>
);
}
});
React.render(
<LikeText />,
document.getElementById('container')
);
var LikeButton = React.createClass({
getInitialState: function() {
return {liked: false};
},
handleClick: function(event) {
this.setState({liked: !this.state.liked});
},
render: function() {
var text = this.state.liked ? 'unlike' : 'like';
return (
<button onClick={this.handleClick}>{text}</button>
);
}
});
React.render(
<LikeButton />,
document.getElementById('container2')
);
</script>
</body>
</html>
需要控制LikeText的那个state除了通过自身state控制外再加上props控制，LikeButton通过改变LikeText的props来控制，需要用到componentWillReceiveProps，代码参考如下：