如何在vuejs中为loader添加setTimeout函数？（检查示例以获得更好的理解）

Question

我正在使用 Element-ui 框架 table 数据，我想在加载器上添加一个计时器，但我不知道该怎么做，因为我是 Vuejs 的新手。

加载器当前设置为真状态，一直在加载，但我想添加定时器功能来加载table数据，但我不知道如何在方法中添加定时器功能。

为了更好地理解，我附上了下面的代码，

查看 Codepen 中的实时示例

如果有人能帮助我，我将不胜感激，谢谢！

<template>
 <el-table
  v-loading="loading"
  :data="tableData"
  style="width: 100%">
  <el-table-column
    prop="date"
    label="Date"
    width="180">
  </el-table-column>
  <el-table-column
    prop="name"
    label="Name"
    width="180">
  </el-table-column>
  <el-table-column
    prop="address"
    label="Address">
  </el-table-column>
</el-table>

<script>
  export default {
   data() {
    return {
     tableData: [{
      date: '2016-05-02',
      name: 'John Smith',
      address: 'No.1518,  Jinshajiang Road, Putuo District'
    }, {
      date: '2016-05-04',
      name: 'John Smith',
      address: 'No.1518,  Jinshajiang Road, Putuo District'
    }, {
      date: '2016-05-01',
      name: 'John Smith',
      address: 'No.1518,  Jinshajiang Road, Putuo District'
    }],
    loading: true
   };
  }
 };
</script>

Answer 1

如果你想添加一个简单的时间，你必须使用一个setTimeout函数。尝试这样的事情：

<template>
  <div>
    {{ loading }}
  </div>
</template>

<script>
export default {
  name: 'App',
  data: () => ({
    loading: true,
  }),
  mounted() {
    setTimeout(() => (this.loading = false), 2000);
  },
};
</script>

更多信息，您可以查看Mozilla

中的文档

如何在vuejs中为loader添加setTimeout函数？（检查示例以获得更好的理解）

How to add setTimeout function to loader in vuejs? (Check Example for better understanding)

javascript

frontend

loader

vue.js

如何在vuejs中为loader添加setTimeout函数？ （检查示例以获得更好的理解）

How to add setTimeout function to loader in vuejs? (Check Example for better understanding)

javascript

frontend

loader

vue.js

如何在vuejs中为loader添加setTimeout函数？（检查示例以获得更好的理解）