Блог

Как передать значение и запустить функцию между двумя компонентами-братьями и сестрами. Я использую React , Крючки

Список элементов существует в компоненте CreateArea.jsx, из которого я хочу удалить элемент. Кнопка удаления существует в компоненте Note.jsx

Есть много способов сделать это .. но я считаю, что Context API отлично работает, если приложение не слишком сложное. Это простой процесс:

1. Настройте поставщика
2. Настройте потребителя и считайте / записывайте данные

Настройте поставщика

 //App.js
const [data, setData] = useState()

let contextValue = {
    data: data,
    handleChange: (d) => setData(d)
}

return (
    <RootContext.Provider value ={contextValue}>
        <AppContainer/>
    </RootContext.Provider>
)
  

Настройка потребителя

 //SomeComponent.js - you can use consumer in any number of components
return(
    <RootContext.Consumer>
        {(handleChange, data) => {
            handleChange({key: value})
            <Text>{JSON.stringify(data)}</Text>
        }}
    </RootContext.Consumer>
)
  

Более подробную информацию можно найти здесь