Folder selector using reactjs

user_6563739 0
Viewed 5305

I need to create a component in Reactjs which lets user select a directory from his system. I tried using

input name="myFile" type="file"

it lets user select files. I want something like this

reactjs export file
2 Answers

Do you want to upload the file?

if your target is that you can simply do it with any third party components which they already have written.

for files you can do this :

<input type="file" onChange={ (event) => this.handleChange(event.target.files) } />

handleChange(selected: FileList)
    {
        console.log(selected);
    }
user_27568380

You can use a package for this pathnpm i path This package is installed by default in node projects, this is used to read file extension, file basename and also we can use this to find the parent directory name (which you asked for) and much more we can do.

You can install this in react as well for reading Directory name Check this method to read the Directory/folder name or Check this Site

But you must give the file path

Also, check Ant-design bootstrap to get access for file path easily Ant-design component Link you can get the path in onChange function.

user_100364180
Related