Asp.net core 在vue.js 中使用echarts

@*
    For more information on enabling MVC for empty projects, visit https://go.microsoft.com/fwlink/?LinkID=397860
*@
@{
	ViewData["Title"] = "分拣";
}
<script src="~/lib/echarts/dist/echarts.js"></script>

<div id="app">
	<div>
		<el-row>

			<span>{{message}}</span>

		</el-row>
		<br />
		<br />



		<el-row>
			<el-table :data="tableBasketPositionDashboard" stripe border style="width:100%">
				<el-table-column prop="partno" label="序号" width="50"></el-table-column>
				<el-table-column label="左边">
					<el-table-column prop="leftSecondFloor" label="左边第二层" width="190"></el-table-column>
					<el-table-column prop="leftSecondFloorQty" label="计数" width="70"></el-table-column>
					<el-table-column prop="leftFirstFloor" label="左边第一层" width="190"></el-table-column>
					<el-table-column prop="leftFirstFloorQty" label="计数" width="70"></el-table-column>
				</el-table-column>
				<el-table-column label="右边">
					<el-table-column prop="rightFirstFloor" label="右边第一层" width="190"></el-table-column>
					<el-table-column prop="rightFirstFloorQty" label="计数" width="70"></el-table-column>
					<el-table-column prop="rightSecondFloor" label="右边第二层" width="190"></el-table-column>
					<el-table-column prop="rightSecondFloorQty" label="计数" width="70"></el-table-column>
				</el-table-column>
			</el-table>
		</el-row>

		<br />
		<br />	<br />
		<br />	<br />
		<br />	<br />
		<br />
		<el-row>
			<div id="main" style="width: 600px; height: 400px" ref="price_ref"></div>
		</el-row>
	</div>
</div>

<script>

	const App =
	{

		data() {
			return {
				message: 'hello word ',

			}
		},
		methods: {
			drawChart() {

				let myChart = window.echarts.init(document.getElementById("main"));
				//let myChart = this.$echarts.init(document.getElementById("main"));

				// 指定图表的配置项和数据
				let option = {
					title: {
						text: "ECharts 入门示例",
					},
					tooltip: {},
					legend: {
						data: ["销量"],
					},
					xAxis: {
						data: ["衬衫", "羊毛衫", "雪纺衫", "裤子", "高跟鞋", "袜子"],
					},
					yAxis: {},
					series: [
						{
							name: "销量",
							type: "bar",
							data: [5, 20, 36, 10, 10, 20],
						},
					],
				};
				// 使用刚指定的配置项和数据显示图表。
				myChart.setOption(option);

			myChart.on('click', (params) => {
					console.log(params);
					this.message= 'myChart click'
				});
			},

		},
		mounted() {
			this.drawChart();
		},

	}
	const app = Vue.createApp(App);
	app.use(ElementPlus);
	app.mount('#app')

</script>