score:7
i think that, the code is usefull for you
updateusersdata() {
const { gender, phone, address, cityid, image, signature } = this.state;
const fd = new formdata();
fd.append('image', image, image.name);
fd.append('gender', gender);
fd.append('phone', phone);
fd.append('address', address);
fd.append('cityid', cityid);
fd.append('signature', signature);
fd.append('_method', 'patch');
axios.post(
`users/${this.props.id}`,
fd,
{ headers: { 'content-type': 'application/x-www-form-urlencoded' } }
);
}
score:0
axios.patch()
doesn't accept formdata
.
however, it does accept a json
.
you could then map formdata into a json. or you can work with json from the start...
let userdata = {};
fd.foreach(function(value, key){
userdata[key] = value;
});
axios.patch(`users/${this.props.id}`, userdata);
i am pretty sure you don't need to define headers explicitly. axios seems to do that internally.
note:
patch
method is for updating a part of a resource (just email and gender, etc...)
put
method is for updating the resource as a whole.
edit: cleaner way to do this
cleaner way to do this is just grabbing the whole form from a ref.
for that you will need to import useref
from react and hook it with your form (for example ref='formref'
) and then you don't need to append anything, you can just grab form data like so:
let fd = new formdata(formref.current); // grabs form data as is
let userdata = {}; // creates a user json
fd.foreach(function(value, key){
userdata[key] = value; // populates user json with form data
});
axios.patch(`users/${this.props.id}`, userdata); // send user json to patch this resource
Source: stackoverflow.com
Related Query
- How can I send FormData with axios patch request?
- How can we send OAuth2.0 with axios in React js
- How to send axios put request with jwt token in reactjs
- How can I send a request to API with on click of my button in React hooks?
- Input data of a PATCH request with formData and Axios is unavailable on Laravel
- How can I wait 5 second to send a HTTP request by Axios in React?
- How can I send two values with Axios in React JS?
- can i send form-data with axios with delete request in react?
- How do I store JWT and send them with every request using react
- How to send body data and headers with axios get request?
- axios cannot send cookie with request even with withCredential: true
- How to have config parameter in axios post request with headers required
- How to send CSRF Cookie from React to Django Rest Framework with Axios
- how to send request to server with reactjs?
- How to send Authorization header with a request in swagger-ui-react?
- How can I mock axios API calls? with using jest
- How to send image to server with Blob type using Axios in React Native?
- how do I make a post and get request with ReactJS, Axios and Mailchimp?
- How to send array of object in post request using axios library
- How to POST request using axios with React Hooks?
- How can I make an axios get request wait before rendering my react component
- How can I send different request in intercepter?
- How to send a POST request with variables in React?
- how can i send formated date to api with react-datepicker
- How do I update state with axios put request on my React application? (React/Node Express)
- How can I send a value with Select tag through the useState on ReactJS
- How to use a custom React hook to make a POST or DELETE request with Axios
- How do I send a post request with axios? (CountriesNow API)
- How can I pass entire react state with post request
- how to store textarea new line value into array with react and send it to node js variable with post request
More Query from same tag
- Trigger focus() on NavLink in react
- Search filtering & dropdown filtering in reactjs
- A/B testing for React SSR app with chunking
- React app with Server-side rendering crashes with load
- I want to create a function that return a tree from a array of objects
- Change x and y properties of textStyle in react google charts
- how to merge two json array of objects and display in react
- Unable to load reactjs components if I visit specific page in my website without visiting my home page - (Node + MongoDB + express + ReactJs)
- How return data from a GraphQL mutation?
- Fill an array with an object (using setState)
- getting error : Could not find a declaration file for module 'react-bootstrap-modal'. in react js
- Confirm Window in React
- How do I turn on the webview autocomplete for an login form in Ionic's capacitor in iOS?
- merge fields of an array with another array with different length in javascript
- how to load a component after useEffect is rendered
- React typescript Types of property 'type' are incompatible
- Grid of responsive squares with independently moving containers horizontally
- Countdown timer with react hooks
- React in AKS gets MIME error for CSS and JS files
- Antd form.item required conditional
- Highcharts doesnot reload or re-render chart on value change
- React render gif files from JSON
- Make a message disappear after sometime in react
- react evironment variables .env return undefined
- React - Passing data from child to parent component
- eslint vscode plugin is not producing warnings for hooks
- How to split a string into two and output them as two different blocks?
- Replace sub-string with React component
- React: how to open a new page without render SideBar component
- React router not rendering the component on click of a Array item