How to correct url in vuejs?

Question

I send a request using axios to http://localhost:8000/api/residence after that i show the result in my page when i want to move to another page by clicking on button i got the wrong url(current url + url of request axios) like this**(http://localhost:8080/http://127.0.0.1:8000/residence/6)** how i can fix this issue.

<div class="col-md-6 col-lg-4" v-for="r in res.data">
   <div class="card-body">
     <h4 class="card-title">{{r.nom}} <br></h4>
   </div>
   <div>
    <router-link :to="'/residence/' + r.id" class="btn btn-outline-primary 
btn-sm btt">Full info</router-link> 
   </div>           
 </div>

axios.get('http://127.0.0.1:8000/api/residence?page=' + page)
.then(response => {   
  this.res = response.data.data;
 });

does your button have a leading / in the href attribute ? href="/http://127.0.0.1:8000/residence/6". — N69S
– N69S, Commented Sep 6, 2019 at 16:58

Sajad Haibat · Accepted Answer · 2019-09-08 11:33:22Z

1

the form :

<form @submit.prevent="addproperty()">
                                <div class="col-md-12">
                                    <div class="form-group">
                                        <label>Property Title</label>
                                        <input type="text" name="property-title" class="form-control" placeholder="Property Title"required v-model="property_title">
                                    </div>
                                </div>

        <button type="submit" class="btn btn-success">Submit</button>
                        </form>

The Url:

<script>
    export default {
        data() {
            return {
                property_title:null,

            }
        },
        methods: {
            addproperty() {

            axios.post('addproperty',{title: this.property_title});
                this.$router.push('/properties_list')
            },

        },
    }

</script>

answered Sep 8, 2019 at 11:33

Sajad Haibat

7176 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Nasser Ali Karimi Over a year ago

Put the description of your answer to help the user understand your code.

Yogaraj · Accepted Answer · 2019-09-06 18:01:36Z

0

Both localhost and 127.0.0.1 are the same. Both of them resolves to your application when accessed either with localhost:8000 or 127.0.0.1:8000.

Its not necessary to provide the base-URL in axios.get function unless you're fetching data from other sites.

axios.get('/api/residence?page='+page) will work fine.

If you need to change the base URL for all the axios calls, you can change the base URL using axios.defaults.baseURL. This would be helpful if you want to prepend /api/ to all of your requests by default.

answered Sep 6, 2019 at 18:01

Yogaraj

3201 gold badge4 silver badges17 bronze badges

Collectives™ on Stack Overflow

How to correct url in vuejs?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related