javascript - 如何在 ReactJS 中访问从 one.js 到 two.js 的 isValid 变量？

Question

我在以下问题中遇到问题下面是存储在“one.js”中的代码

const One= (props) => {
  const [isValid, setIsValid]=useState(true);
  return(
      <div>Hello</div>
 );
}
export default One;

下面是存储在“two.js”中的代码

import One from './one.js'; 
var Two=()=>{
    return(
        <div>Two</div>
    );
 }
 export default Two;

标签： javascripthtmlcssreactjs

Answer 1

你不能从 reactjs 中的另一个组件访问组件的状态

您必须为此目标学习和使用 redux 或使用钩子

但是如果您想在纯 reactjs 中执行此操作，则必须使一个组件成为另一个组件的父组件，并将状态作为道具发送给子组件

像这样：

//one.jsx
class one extend React.Component{
    constructor(props){
        super(props)
        this.state = {
            text: ""
        }
    }
    render(){
        return <Two props={this.state.text} />
}

然后在 two.jsx 组件中使用它

class Two extend React.Component{
    render(){
        <div>{this.props.text}</div>
    }
}