yiliangyiyun-app/pages/charts/charts.vue

<template>
	<view>
		<view class="charts-box">
		  <qiun-data-charts
		 @getIndex='getdata'
		    type="column"
		    :chartData="chartData"
		    background="none"
		  />
		</view>
	</view>
</template>

<script>
	export default {
		name: "buy",
		data() {
			return {
				chartData:{
				 categories:['2016','2017','2018','2019','2020','2021'],
				 series:[{
				  name:'目标值',
				  data:[35, 36, 31, 33, 13, 34]
				 },{
				  name:'完成量',
				  data:[18, 27, 21, 24, 6, 28]
				 }]
				}
			};
		},
		onShow() {
			new uCharts({
				$this:_self,
				canvasId: canvasId,
				type: 'line',
				fontSize:11,
				legend:{show:true},
				dataLabel:true,
				dataPointShape:true,
				background:'#FFFFFF',
				pixelRatio:_self.pixelRatio,
				categories: chartData.categories,
				series: chartData.series,
				animation: true,
				xAxis: {
					disabled:true,
					disableGrid:false,
					type:'grid',
					gridColor:'#CCCCCC',
					gridType:'dash',
					dashLength:8
				},
				yAxis: {
					gridType:'dash',
					gridColor:'#CCCCCC',
					dashLength:8,
					splitNumber:5,
					min:10,
					max:180,
					format:(val)=>{return val.toFixed(0)+'元'}
				},
				width: _self.cWidth*_self.pixelRatio,
				height: _self.cHeight*_self.pixelRatio,
				extra: {
					lineStyle: 'straight'
				}
			});
		},
		onLoad(options) {
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		//下拉刷新
		onPullDownRefresh() {
			this.pages = 1
			this.isLoadMore = false
			this.loadStatus = 'loading'
			this.loadData()
		},
		onReachBottom(){  //上拉触底函数
		  if(!this.isLoadMore){  //此处判断，上锁，防止重复请求
				this.isLoadMore=true
				this.pages += 1
				this.getIndexBuyData()
		  }
		},
		methods: {
			getdata(){
				console.log(11111)
			}
		},
	}
</script>

<style>
	.charts-box{
	  width: 100%;
	  height:300px;
	}
</style>