vue3.x全局引入echarts5.x
echarts5和4有一些区别打开之后查看:引用 ECharts去除 default exports 的支持如果使用者在 v4 中这样引用了 echarts:import echarts from 'echarts';// 或者按需引入import echarts from 'echarts/lib/echarts';这两种方式,v5 中不再支持了。使用者需要如下更改代码解决这个问题:import
·
echarts5和4有一些区别
打开之后查看:
引用 ECharts
去除 default exports 的支持
如果使用者在 v4 中这样引用了 echarts:
import echarts from 'echarts';
// 或者按需引入
import echarts from 'echarts/lib/echarts';
这两种方式,v5 中不再支持了。
使用者需要如下更改代码解决这个问题:
import * as echarts from 'echarts';
// 按需引入
import * as echarts from 'echarts/lib/echarts';
然后在查看vue3.x,因为3.x和2.x也是有区别的
然后大概就了解要怎么引入了:
import { createApp } from "vue";
import App from "./App.vue"; //引入app组件
import store from "./store"; //引入状态管理
import * as echarts from 'echarts'; //引入echarts(5.0以上版本去除了exprot default)
import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';
//引入公共的css样式
import "./assets/common.css";
// 引入字体样式
import './assets/fonts/font.css';
/**
* 在vue2.x中,一般直接new vue()实例化即可
* 在vue3.x中,通过createApp来返回一个实例,而且可以链式操作
*/
const app = createApp(App);
app.config.globalProperties.$echarts = echarts //绑定实例
app.use(store).use(ElementUI).mount("#app");
更多推荐
已为社区贡献2条内容
所有评论(0)