NFT/components/mchart.vue

<template>
	<view class="content">
		<qiun-data-charts type="line" :chart-data="chartData" echartsApp />
	</view>
</template>

<script>
	 
	import {
		lalaprice 
	} from '@/api/wallet.js'
	export default {
		data() {
			return {
				chartData: {
					categories: [],
					series: [{
						name: 'Lala走势',
						data: []
					}]
				}
			}
		},

		mounted() {
			console.log(this.chartData, '渲染完毕');
			this.createChart()
		},
		methods: {
			createChart() {
				lalaprice().then(e => {
					console.log(e.data, "123456")
					// this.chart_data = e.data

					let time = e.data.map(item => {
						return item.date
					})
					console.log(time)

					this.$set(this.chartData, 'categories', time.reverse())

					let val = e.data.map(item => {
						return +item.lala_price
					})

					console.log(val)
					this.$set(this.chartData.series[0], 'data', val.reverse())
					// 		option = {
					// 			xAxis: {
					// 				type: 'category',
					// 				data: time
					// 			},
					// 			yAxis: {
					// 				type: 'value'
					// 			},
					// 			series: [{
					// 				data: val,
					// 				type: 'line'
					// 			}],
					// 			grid: {
					// 				left: '15%',
					// 				right: '2%'
					// 			}
					// 		};

					// 		option && myChart.setOption(option);
				}).catch((E) => {
					console.log(E);
				})

			}
		}
	}
</script>

<style lang="scss" scoped>
	.content {
		width: 750rpx;
		height: 500rpx;
	}

	.line-chart {
		height: 500rpx;
		width: 730rpx;
		margin: auto;
		background-color: #eee;
	}
</style>