Hello,
My question is related to tui image editor which is free and open source.
I’m trying to load an image in tui after clicking the thumbnail image. And you can see the most related parts of the codes:
ImageContet.js
import React from 'react';
const ImageContext = React.CreateContext('null');
export default ImageContext;
ImageUpload.js
return (
<ImageContext.provider value={this.state.selectedFile.name}>
<div>
<div style={mystyle} onClick={this.onNavToEditor}/>
<h1>File Upload Demo</h1>
<div >{this.state.uploadResult} onClick={this.onNavToEditor}</div>
<div>
<input type="file" onChange={this.onFileChange} />
<input type="text" value={this.state.value} onChange={this.onDescriptionChange} />
<button onClick={this.onFileUpload}>
Upload!
</button>
</div>
{this.listItems()}
</div>
</ImageContext.provider>
);
ImageEditor.js
//using the context
const currentImage = React.UseContext(ImageContext);
//defining the function for loading the images
openImage = () => {
loadImageFromFile(currentImage);
};
componentDidMount()
{
this.openImage();
};
You can see I shared the image name via context to ImageEditor.js and then tried to load it.
more details on loading image in tui:
thanks,