Tengo que hacer una solicitud de publicación para ordenar una URL compleja: http://localhost:8080/api/login?email=example%40gmail.com&password=examplepassword según swagger-ui. Los ejemplos en la página de github de axios dicen que el segundo parámetro es un objeto. En mi ejemplo, el segundo parámetro debe incluir las propiedades de correo electrónico y contraseña, pero ¿después de eso? Intenté muchas maneras de sacar esta situación de. Uno de estos está abajo. Por cierto, se produce este error: xhr.js:187 POST http://localhost:8080/api/login?email=asdsadsad&password=[object%20Object]
Segmento de cliente:
const customerService = new CustomerService() export const logCustomerIn = createAsyncThunk( 'customer/logCustomerIn', async (email, password)=>{ // const response = await customerService.logCustomerIn(email, password) const response = await axios.post(`http://localhost:8080/api/login?email=${email}&password=${password}`) console.log(response) return response.data.success } ) export const getCustomers = createAsyncThunk( 'customer/getCustomers', async ()=>{ const response = await customerService.getAll() return response.data.data } ) export const getCustomerByEmail = createAsyncThunk( 'customer/getCustomerById', async(email)=>{ const response = await customerService.getCustomerByEmail(email) console.log(response) return response.data.data } ) export const customerSlice = createSlice({ name:'customer', initialState: { items:[], currentCustomer:{}, loggedIn:false, }, reducers:{}, extraReducers:{ [logCustomerIn.fulfilled]:(state,action)=>{ state.loggedIn = true console.log("logcustomer fulfilled") }, [getCustomers.fulfilled]:(state,action)=>{ state.items = action.payload }, [getCustomerByEmail.fulfilled]: (state,action)=>{ state.currentCustomer = action.payload console.log(state.currentCustomer) } } }) export default customerSlice.reducerEl problema es que la función de devolución de llamada que pasa a createAsyncThunk se llama con un segundo parámetro que es un objeto llamado "thunkAPI", y no la contraseña que pretendía. Consulte este documento: https://redux-toolkit.js.org/api/createAsyncThunk .
TL;RD;
Si necesita pasar varios valores, páselos juntos en un objeto cuando envíe el thunk.
Entonces, lo que debes hacer es pasar un objeto como este
{ email: <user_email>, password: <user_password> }y cambie el código que envía la solicitud en consecuencia:
export const logCustomerIn = createAsyncThunk( 'customer/logCustomerIn', async (credentials)=>{ const response = await axios.post(`http://localhost:8080/api/login?email=${credentials.email}&password=${credentials.password}`) console.log(response) return response.data.success } )