Error trying to save in BD

Asked

Viewed 51 times

0

I am using the React and when I try to save in the database returns me this error:

Cannot read property 'protocol' of undefined

My code is this:

const baseUrl = "http://localhost:8000/api/employee";

import axios from 'axios';

const employee = {};

employee.list = async () => {
    const urlList = baseUrl + "/role";
    const res = await axios.get(urlList)
        .then(response => {
            return response.data;
        })
        .catch(error => {
            return error;
        })
    return res;
}
employee.save = async (data) => {
    const urlSave = baseUrl + "/create";
    const res = await axios.post(urlSave.data)
        .then(response => {
            return response.data;
        })
        .catch(error => {
            return error;
        })
    return res;
}

export default employee;

one last piece of information my vs code accuses that the data of Employee.save is not being used anywhere I have tried to use this and change the way in .env and nothing works someone can help?

javascript laravel react

  • is a mix with your promise or uses async and await or the method then, that is, the code is written totally wrong and so of strange errors.

  • 2

    When you send the post, you have to send the data. For example: You are doing so await axios.post(urlSave.data), I think you wanted to do it like this: await axios.post(urlSave, data). And another, if you’re going to use the await not so you don’t use the then nor catch

  • truth another problem that went unnoticed @adventistaam, beyond the promise, was not passed the value in post!

  • And as far as I know, first sets up the axios. const http = axios.create( ({baseURL: urlbase }). And then you use the verbs: http.get(), http.post(), etc

  • No @adventistaam, is not rule to work, is not required!

  • 1

    Ah, ta! Blz.....

Show 1 more comment

2 answers

1

Friend, try to do this using async/await only. What you did was use the pormisses along with async/await, which is wrong. In addition to not starting the instance of Axios.

const baseUrl = "http://localhost:8000/api/employee";
    
import axios from 'axios';

const api = axios.create({
  baseUrl: baseUrl
});
    
const employee = {};
    
employee.list = async () => {
  try {
    const { data } = await api.get('/role')

    return data;
  } catch(err) {
    return err;
  }
};

employee.save = async (data) => {
  try {
    const { data: respData } = await api.post('/create', data)

    return respData;
  } catch(err) {
    return err;
  }
}

export default employee;

  • a reservation does not need and is not a rule that needs to use create in the axios, you may or may not use, make it easier if used in multiple places with the same address, but is not required.

  • Yes, I agree with you @novic, it’s not mandatory, it makes understanding easier and it would be even better if I was in a separate file.

1


I believe you’re using a point (.) in place of the comma (,) to send the data

Another interesting thing is that you’re using async and then catch in his role

employee.save = async (data) => {
    const urlSave = baseUrl + "/create";
    const res = await axios.post(urlSave.data)
        .then(response => {
            return response.data;
        })
        .catch(error => {
            return error;
        })
    return res;
}

In the stretch axios.post(urlSave.data), try to replace with axios.post(urlSave, data)

And on the return part for you can so much so:

 const res = await axios.post(urlSave.data)
 return res;

Getting at the end its function like this:

employee.save = async (data) => {
    const urlSave = baseUrl + "/create";
    const res = await axios.post(urlSave, data)
    return res;
}

Or so:

const res = axios.post(urlSave.data)
                 .then(response => {
                      response.data 
                  }).catch(error => {
                       console.log(error)
                  })

There in the latter for you to get the valorse you will have to use a Promise

Thus remaining:

employee.save = (data) => {
     return new Promise((resolve, reject)=>{
         const urlSave = baseUrl + "/create";
         axios.post(urlSave, data)
              .then(response => {
                 resolve( response.data );
               })
               .catch(error => {
                   reject(error)
               })
          })

Then to get the value in this function would have to be using async or then

I hope it helps

Browser other questions tagged javascript laravel react

You are not signed in. Login or sign up in order to post.