vue表格刚点击页面怎么自动请求数据
时间: 2024-02-16 11:03:56 浏览: 8
你可以在Vue组件的created钩子函数中发送请求获取数据。例如,可以使用axios库发送GET请求来获取数据。具体代码如下:
```
<template>
<div>
<table>
<thead>
<tr>
<th>Column 1</th>
<th>Column 2</th>
<th>Column 3</th>
</tr>
</thead>
<tbody>
<tr v-for="(item, index) in items" :key="index">
<td>{{ item.col1 }}</td>
<td>{{ item.col2 }}</td>
<td>{{ item.col3 }}</td>
</tr>
</tbody>
</table>
</div>
</template>
<script>
import axios from 'axios';
export default {
data() {
return {
items: []
};
},
created() {
axios.get('/api/data').then(response => {
this.items = response.data;
}).catch(error => {
console.log(error);
});
}
}
</script>
```
在这个例子中,我们在created钩子函数中发送了一个GET请求,请求地址为'/api/data',当请求成功时,我们将响应数据赋值给组件的items属性。这样,在组件加载时就会自动获取数据并显示在表格中。