@vladimir Вы можете использовать axios библиотеку чтобы сделать Ajax запрос в Vue.js, ниже пример кода как пример:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 |
<template> <div class="container"> <h1>Test Component</h1> <button @click="sendAjax">Сделать ajax запрос</button> </div> </template> <script> import axios from 'axios' export default { name: 'Test', methods: { sendAjax() { axios .get('https://httpbin.org/get') .then((response) => { console.log(response.data) }) .catch((e) => { console.log(`Ошибка: ${e}`) }) }, }, } </script> |
@vladimir
Чтобы сделать ajax запрос в Vue.js, можно использовать библиотеку axios или Vue Resource.
Для использования axios, необходимо установить пакет через npm:
1
|
npm install --save axios |
Затем в компоненте Vue можно сделать запрос в методе mounted():
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 |
import axios from 'axios'; export default { data() { return { posts: [], }; }, mounted() { axios.get('https://jsonplaceholder.typicode.com/posts') .then(response => { this.posts = response.data; }) .catch(error => { console.log(error); }); } } |
Для использования Vue Resource, необходимо установить пакет через npm:
1
|
npm install --save vue-resource |
Затем в компоненте Vue можно сделать запрос в методе mounted():
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
import Vue from 'vue'; import VueResource from 'vue-resource'; Vue.use(VueResource); export default { data() { return { posts: [], }; }, mounted() { this.$http.get('https://jsonplaceholder.typicode.com/posts') .then(response => { this.posts = response.body; }) .catch(error => { console.log(error); }); } } |