I'm following a tutorial to learn Vue+Laravel and it uses Axios for the Ajax request on these lines in the script for the Vue Component. The error causing me grief is on the console log is:
POST http://localhost/favorite/2 404 (Not Found)
my website lives locally on wamp at a different folder which looks like the issue. I can't use the normal laravel "Url(' ') helper function to get the route directory. So how would I do this in javascript rather just hardcoding my local host site in which isn't good for pushing to a real server in the future. Thanks!
http://localhost/laravel/public/
methods: {
favorite(post) {
axios.post('/favorite/'+post)
.then(response => this.isFavorited = true)
.catch(response => console.log(response.data));
},
unFavorite(post) {
axios.post('/unfavorite/'+post)
.then(response => this.isFavorited = false)
.catch(response => console.log(response.data));
}
}
Create a new axios instance when the component is mounted:
mounted() {
this.axios = axios.create({
baseURL: 'http://localhost',
});
}
You could even go ahead an store the base uri in a data attribute:
data() {
baseUri: 'http://localhost',
},
mounted() {
this.axios = axios.create({
baseURL: this.baseUri,
});
}
Then later in your methods you can make use of this.axios
. See the docs for reference.
Cheers!
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.