Vue-Vue技术github案例(发送ajax)
在Vue中,你可以使用axios
库来发送AJAX请求。以下是一个简单的例子,展示了如何在Vue组件中发送GET请求:
首先,安装axios
:
npm install axios
然后,在你的Vue组件中使用它:
<template>
<div>
<button @click="fetchData">Fetch Data</button>
<div v-if="data">
Fetched Data: {{ data }}
</div>
</div>
</template>
<script>
import axios from 'axios';
export default {
data() {
return {
data: null,
};
},
methods: {
fetchData() {
axios.get('https://api.example.com/data')
.then(response => {
this.data = response.data;
})
.catch(error => {
console.error('There was an error!', error);
});
},
},
};
</script>
在这个例子中,当按钮被点击时,fetchData
方法会被触发,从https://api.example.com/data获取数据,并在获取成功后将数据存储在组件的\`data\`属性中。如果请求失败,它会在控制台输出错误信息。
评论已关闭