Vue中批量的mock数据

使用场景：当后台接口未完成时，前端在本地开发环境的数据mock，维持开发进度。

1、结合es6的高阶函数Map和JavaScript的Apply()完成

<template>
  <article calss="app-container">
      <div v-for="(app, index )in appList" :key="index" class="app-item">
          <span class="app-icon">{{ app.imageUrl }}</span>
          <span class="app-name">{{ app.name }}</span>
      </div>
  </article>
</template>
<script>
  export default {
    data() {
      return {
          this.appList: []
      }
    },

    methods: {
      getAppList() {
        // AppList的长度在new Array创建数组弹性控制，想要创建多少个对象则自行定义
        this.appList = Array.apply(null, new Array(10)).map((item, index) => {
          return {
            // 字段的数量根据个人的需求来自行定义
            name: `nginx${index}`,
            imgUrl: 'nginx'
          }
        }
      },
    },

  }
</script>