40 lines
966 B
TypeScript
40 lines
966 B
TypeScript
|
import { defineComponent, onUnmounted, reactive } from 'vue'
|
||
|
|
import Draw from './draw'
|
||
|
|
|
||
|
|
export default defineComponent({
|
||
|
|
components: {
|
||
|
|
Draw,
|
||
|
|
},
|
||
|
|
setup() {
|
||
|
|
let intervalInstance = null
|
||
|
|
const cdata = reactive({
|
||
|
|
xData: ['数据1', '数据2', '数据3', '数据4', '数据5', '数据6'],
|
||
|
|
seriesData: [
|
||
|
|
{ value: 10, name: '数据1' },
|
||
|
|
{ value: 5, name: '数据2' },
|
||
|
|
{ value: 15, name: '数据3' },
|
||
|
|
{ value: 25, name: '数据4' },
|
||
|
|
{ value: 20, name: '数据5' },
|
||
|
|
{ value: 35, name: '数据6' },
|
||
|
|
],
|
||
|
|
})
|
||
|
|
intervalInstance = setInterval(() => {
|
||
|
|
const data = cdata.seriesData
|
||
|
|
cdata.seriesData = data.map((e) => {
|
||
|
|
return { value: e.value + 10, name: e.name }
|
||
|
|
})
|
||
|
|
}, 1000)
|
||
|
|
|
||
|
|
onUnmounted(() => {
|
||
|
|
clearInterval(intervalInstance)
|
||
|
|
})
|
||
|
|
return () => {
|
||
|
|
return (
|
||
|
|
<div>
|
||
|
|
<Draw cdata={cdata} />
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
},
|
||
|
|
})
|