Problem with routes in the Axios + Aravel

Question

I’m using vue.js with axios to make Cruds but I have a question about routes.

I have the following routes:

| DELETE   | admin/deleteprod/{id}    | componet_3.produtos | App\Http\Controllers\ProdutoController@destroy                                   
| PUT      | admin/updateprod/{id}    | componet_2.produtos | App\Http\Controllers\ProdutoController@update 

I’m using the following methods:

  updat:function(id){
      var url='updateprod/'+ id;  
     axios.put(url,  this.fillproduto).then(response=>{

        this.getProdutos();
        this.fillproduto={'id':'','nome_pro':'','descricao_pro':'' };
        $('#edit').modal('toggle');

    });
    console.log(url);

    }, 

   deleteprod:function(id){
    var url='deleteprod/'+ id;
    axios.delete(url).then(response=>{
        this.getProdutos(); 
    });
    //alert('id'); 
    console.log(url); 
  } ,

As you can see, I’m not using the url in the methods only the last parameter, because if I use the url whole, the method stops working.

My question is whether this is normal and can generate any future problems in my application. I haven’t found any documentation about this.

Answer 1

Two tips:

1. I recommend you define the baseUrl in Xios and if you need to access another url, just use the absolute path /o-path or a new url http://..../o-path.

You can use Axios.create() for this.

2. No need to add in the path "update" or "delete" ... The verb (PUT/DELETE/...) already serves for this purpose.

Your endpoint would be PUT admin/{id}. The PUT verb, you already know it’s an update.

Axios Settings: - https://github.com/axios/axios#request-config