我仍然是初学者，我想使用这个函数this.state发送变量到其他组件
是我的代码。这是我的index.html文件代码
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<title>Add React in One Minute</title>
<script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
<script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
<script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.4.1/dist/css/bootstrap.min.css" >
<link rel="stylesheet" href="catalog/view/theme/default/template/account/purpletree_multivendor/buynow/checkout.css" />
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<div id="root"></div>
<script type="text/babel" src="catalog/view/theme/default/template/account/purpletree_multivendor/buynow/App.js"></script>
<script type="text/babel">
ReactDOM.render(<App />, document.getElementById("root"));
</script>
</body>
</html>
i build文件名App.js
class Login extends React.Component {
constructor(props) {
super(props);
this.state = {
skipButton: false
};
}
changeSkipPage = () => {
this.setState = {skipButton: true},
<Home handleClick={this.setState.skipButton} />
}
render() {
return (
<div>
<a onClick={this.changeSkipPage}>
<span> Skip Login</span>
</a>
</div>
)
}
}
class Welcome extends React.Component {
render() {
return (
<div>
Welcome World
</div>
)
}
}
class Home extends React.Component {
constructor(props) {
super(props);
console.log(props)
}
render() {
return (
// set condition if can get variable handleClick is true. will have condition to change other page
// if(variable handleClick is true) {
// will call page <Welcome />
// }else{
// still login page
// }
)
}
}
所以我要做的是，Home类是Login类和Welcome类的组合成分。第一个显示的是Login类，如果条件是用户点击跳过按钮，Home类显示将变为Welcome类
但上面的代码不起作用。当点击跳过按钮到Home类时，它不会从Login类发送变量
请帮助。
你可以通过将状态传递给子组件来实现这一点，这对于小应用来说是没问题的。
如果你正在构建的不是很小，那么建议使用全局状态，如Redux。
还有一点。了解类组件及其生命周期钩子是如何工作的是件好事，但建议使用带有钩子的函数式组件
祝你好运