no message
Former-commit-id: f2b3cdd472d8bfa1a3de80ff8232b34ece29e12c Former-commit-id: 491a5fec77afac0c98b59f6cc7999edbb10a4d9d Former-commit-id: bcb2796ae13b86fd63755f9d3e76e162d096a240
This commit is contained in:
@@ -1,52 +0,0 @@
|
|||||||
<template>
|
|
||||||
<Container>
|
|
||||||
<div slot="header">
|
|
||||||
<el-tooltip effect="dark" content="生成数据需要几秒钟的时间 依电脑配置而定" placement="top">
|
|
||||||
<el-button v-if="tableDataTemp.length === 0" @click="makeData">Mock 10,000 条数据</el-button>
|
|
||||||
</el-tooltip>
|
|
||||||
<el-button v-if="tableDataTemp.length > 0" @click="tableData = tableDataTemp">渲染数据</el-button>
|
|
||||||
</div>
|
|
||||||
<table v-if="tableData.length > 0" border="1" class="gridtable">
|
|
||||||
<tr v-for="(item, index) in tableData" :key="index">
|
|
||||||
<th v-for="(key, keyIndex) in Object.keys(item)" :key="keyIndex">{{item[key]}}</th>
|
|
||||||
</tr>
|
|
||||||
</table>
|
|
||||||
</Container>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import Mock from 'mockjs'
|
|
||||||
export default {
|
|
||||||
data () {
|
|
||||||
return {
|
|
||||||
tableDataTemp: [],
|
|
||||||
tableData: []
|
|
||||||
}
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
makeData () {
|
|
||||||
this.tableDataTemp = Mock.mock({
|
|
||||||
'list|10000': [{
|
|
||||||
'id|+1': 1,
|
|
||||||
'name': '@CNAME',
|
|
||||||
'num1': '@NATURAL(10, 1000)',
|
|
||||||
'num2': '@NATURAL(10, 1000)',
|
|
||||||
'num3': '@NATURAL(10, 1000)',
|
|
||||||
'num4': '@NATURAL(10, 1000)',
|
|
||||||
'num5': '@NATURAL(10, 1000)',
|
|
||||||
'num6': '@NATURAL(10, 1000)',
|
|
||||||
'num7': '@NATURAL(10, 1000)',
|
|
||||||
'num8': '@NATURAL(10, 1000)',
|
|
||||||
'num9': '@NATURAL(10, 1000)',
|
|
||||||
'num10': '@NATURAL(10, 1000)',
|
|
||||||
'num11': '@NATURAL(10, 1000)',
|
|
||||||
'num12': '@NATURAL(10, 1000)',
|
|
||||||
'num13': '@NATURAL(10, 1000)',
|
|
||||||
'num14': '@NATURAL(10, 1000)',
|
|
||||||
'num15': '@NATURAL(10, 1000)'
|
|
||||||
}]
|
|
||||||
}).list
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</script>
|
|
||||||
5
src/pages/demo/business/data/worker/index.vue
Normal file
5
src/pages/demo/business/data/worker/index.vue
Normal file
@@ -0,0 +1,5 @@
|
|||||||
|
<template>
|
||||||
|
<Container>
|
||||||
|
worker
|
||||||
|
</Container>
|
||||||
|
</template>
|
||||||
@@ -14,11 +14,11 @@ export const menu = {
|
|||||||
icon: 'flask',
|
icon: 'flask',
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
title: '大型数据渲染',
|
title: '使用 Worker',
|
||||||
icon: 'file-o',
|
icon: 'file-o',
|
||||||
path: 'data/largeData',
|
path: 'data/worker',
|
||||||
name: 'demo-business-data-largeData',
|
name: 'demo-business-data-worker',
|
||||||
component: resolve => { require(['@/pages/demo/business/data/largeData/index.vue'], resolve) }
|
component: resolve => { require(['@/pages/demo/business/data/worker/index.vue'], resolve) }
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user