React JS - 如何使用/更改状态或与导入组件的功能

我是ReactJS中的新手，最大的问题是...是否将解决方案划分为其他文件以组织代码？我认为这比同一个文件中的许多组件好，但是，在文件划分中这带来了一个大问题，这些文件之间如何使用/更改状态或功能？React JS - 如何使用/更改状态或与导入组件的功能

文件Index.jsx

// index.jsx 
Import SecondComponent from '/Components/SecondComponent.jsx' 

class FirtstComponent extends React.Component { 
    state = { 
     mystate: false 
    } 
}

文件SecondComponent.jsx

// SecondComponent.jsx 
class SecondComponent extends React.Component { 
    setState = ({ 
     this.setState({ mystate: true }) 
    }) 
}

我怎样才能改变FirstComponent从 SecondComponent状态？

来源

2017-07-28 Vitor Paixão

我很抱歉，但我不明白的问题，你能不能详细阐述一些？ – meerlol

你应该提供一个例子。在大多数代码库中，每个文件只有一个组件导致数百或数千个文件，状态更改通过道具传递状态和更新功能来管理 – azium

您的问题是如何更新不同组件的状态？ –

我不是100％肯定你是问什么，但我想你想要的是这样的：

*FirstComponent.jsx* 
class FirtstComponent extends React.Component { 
    state = { 
     mystate: false 
    } 

    const myFunction =() => { 
     this.setState({ mystate: true }) 
    } 

    render() { 
     return (
     <SecondComponent function={myFunction} /> 
    ) 
    } 
} 

*SecondComponent.jsx* 
export default class SecondComponent extends React.Component { 
    render() { 
     return (
     <div onClick={this.props.function} /> 
    ) 
    } 
}

来源

2017-07-28 15:35:14

是的，正是这个......谢谢！ –

React JS - 如何使用/更改状态或与导入组件的功能

回答

相关问题