如何通过上下文将单击的对象名称和路径发送到另一个组件

Question

我正试图通过上下文将单击的图像名称和路径从一个反应内容发送到另一个。但每次它都返回一个null对象。

以下是创建、提供和使用上下文的过程：

创建：

import React from 'react';
const ImageContext = React.createContext()
export default ImageContext;

提供：

import ImageContext from '../ImageContext';
onFileChangeName = event => {
this.setState({ selectedFileName: event.target.files[0].name });
};
return (

<ImageContext.Provider value={this.state.selectedFileName}>
</ImageContext.Provider >

消耗：

return (
<ImageContext.Consumer>
{value => (

<ImageEditor
includeUI={{
loadImage: {
path: value.path,
name: value,
},

</ImageContext.Consumer>
);

请通知我。

Answer 1

为此，您需要在react js 中使用状态和道具

你可以在下面提供的链接中了解更多信息

https://www.freecodecamp.org/news/react-js-for-beginners-props-state-explained/