vue.js for延时请求如何写

在 Vue.js 中，可以使用 `async/await` 关键字和 `setTimeout` 函数来实现 `for` 循环中的延时请求。具体实现方法如下：

1. 在 Vue 组件中定义一个异步函数，用于发送请求并等待一定的时间后再返回结果：

async function getDataWithDelay(delay) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      axios.get('/api/data').then(response => {
        resolve(response.data);
      }).catch(error => {
        reject(error);
      });
    }, delay);
  });
}

在这个例子中，异步函数 `getDataWithDelay` 接受一个参数 `delay`，表示延时的时间。在函数内部，通过 `setTimeout` 函数来等待一定的时间后再发送请求，并将请求结果通过 `resolve` 函数返回。

2. 在 Vue 组件中定义一个异步函数，用于发送延时请求并输出结果：

async function requestData() {
  for (let i = 0; i < 10; i++) {
    const data = await getDataWithDelay(1000);
    console.log(data);
  }
}

在这个例子中，`requestData` 函数使用 `for` 循环发送 10 次延时请求，每次请求延时 1000 毫秒。使用 `await` 关键字等待异步函数的返回结果，避免了重复请求的问题，并且保证了每次请求的间隔时间。

3. 在 Vue 组件中调用 `requestData` 函数，开始发送延时请求：

requestData();

在这个例子中，调用 `requestData` 函数，开始发送延时请求。在 Vue 组件中，可以在 `mounted` 钩子函数中调用该函数，实现组件渲染后自动发送请求的效果。