score:2
Accepted answer
to read multiple images:
1. first define a function that will read a single file.
2. use any loop to call that function for each entry of the array.
3. use array in state
variable to store the result, instead of a single variable.
constructor(props) {
super(props);
this.state = {
image: []
};
}
use this function to read multiple files:
ondropmain(mainimage) {
var that = this;
function read(file){
let reader = new filereader();
reader.onload = function (event) {
let image = that.state.image.slice();
image.push(event.target.result);
that.setstate({image}, () => console.log(image));
};
reader.readasdataurl(file);
}
if (mainimage && mainimage.length) {
[].foreach.call(mainimage, read);
}
}
check the answers of this question for details about [].foreach.call(mainimage, read)
.
Source: stackoverflow.com
Related Query
- REACT DROPZONE: Get data:images after upload
- How do I get a React Native TextInput to maintain focus after submit?
- How to get the changed state after an async action, using React functional hooks
- React checkbox get (un)checked after the second click
- React - get element.getBoundingClientRect() after window resize
- How to get a data after react select using axios and ReactJS?
- get latest state value after setState hook within async await block in react
- in react can't get new value after immediately setState
- Is there a way to upload a file in React Dropzone with Puppeteer?
- Get local file path in React Dropzone
- How to Upload Images to Firebase Storage and Get Image's Download URL's When Using Dropzone in React.js
- How to get the time in seconds after click on submit button using React Count Down Timer
- Can't get upload image value by using React hook form
- how to get state right after state change in react hooks
- After deploying React app to Heroku from dev env, Fetch requests broken - all GET requests returning index.html - others are 404
- How to get React to update after first API call
- Need browsers refresh to get data displayed after user Login in react using redux
- How to get cropped image after crop as a form data in react
- My React site only show home page, all other pages not found after upload on live server
- Get event object in react forms after onChange is called
- Get latest Redux state in React immediately after state change
- React Dropzone Multiple Image Upload With Tastypie
- How to trigger GET after POST in React so new item would show without reloading page
- How to get React to re fetch my data from API after a POST or DELETE to Database?
- react doesn't get re-render after getting new store state into props
- Can't get React component to update after setting state after Axios call
- React Redux - get user after login and auth token
- How to get checkbox value immediately after setting the state in react
- React Timer value get struck after it reaches 12 sec
- Why I get null in the first click and in the second or any click after it i get input element correct, react js?
More Query from same tag
- Form validation test on submit with mock data
- Axios post does not send data
- User avatar not shown in meteor react
- Why is my reducer returning undefined, React TypeScript
- React - Can't render array of elements
- Create React App not installing, showing an error and aborting installation
- How do I trigger a call to dispatch using React Hooks?
- how to access a custom react component function from its parent component?
- Dynamically set style attributes for an Image in React
- What's the proper way to grab an object from my Entities dictionary in a Normalized state and pass it to a component?
- React JS setState not working, showing blank page
- How to reference currect element inside its defaultChecked - React
- problem with rendering an object property from API object
- this is null in one function, not in another of the same class
- How add new object property while updating state in React
- Why does it require authentication to load DB values?
- how to use Link to with Tabs component React from Antd Design
- Downloading a video from an API in React using Axios creates an empty mp4 file
- How to get user input passed to params in axios get
- ReactJS fields are not editable for Dynamic Fields
- React - Load JSON and render component
- UseEffect still runs even if fetch data doesnt change
- React Redux connect is not assignable to type '() => void' with typescript
- props-dependent Switch color in Material-UI
- Button Click inside anchor tag not working in React Js Component
- Can't fit react-player into div
- Axios onDownloadProgress (on get method) gets called only once and setTimeout in callback never gets called
- How to change sequelize model.findOne() target table?
- Subscribing to a redux action in a react component
- create react app not loading css background images in dev or build