【Vue】實戰專案:電商後臺管理系統(八)資料統計模組

語言: CN / TW / HK

theme: vue-pro highlight: a11y-dark


嗨!~ 大家好,我是YK菌 🐷 ,一個微系前端 ✨,愛思考,愛總結,愛記錄,愛分享 🏹,歡迎關注我呀 😘 ~ [微訊號: yk2012yk2012,微信公眾號:ykyk2012]

「這是我參與11月更文挑戰的第13天,活動詳情檢視:2021最後一次更文挑戰

專案地址:https://gitee.com/ykang2020/vue_shop

今天繼續用Vue和Element做後臺管理系統的專案,這次實現最後一個模組——資料統計模組

1. 分支git操作

powershell git checkout -b report git push -u origin report

2. 掛載Report元件及基本佈局

和之前的步驟一樣,先把主體框架搭好

```html

```

3. 安裝echarts執行依賴並渲染demo圖表

這裡我們使用echarts來展示圖表

http://echarts.apache.org/zh/index.html

```html

```

可以看到效果【這是入門demo例項】

在這裡插入圖片描述

4. 獲取資料並渲染表格

接下來我們就要渲染自己的資料為圖表了

首先拿到介面文件 在這裡插入圖片描述

```html

```

5. 展示

最後來看我們資料視覺化的效果

在這裡插入圖片描述

6. 分支git操作

powershell git add . git commit -m "完成報表功能" git push git checkout master git merge report git push

專案地址:https://gitee.com/ykang2020/vue_shop

最後,歡迎關注我的專欄,和YK菌做好朋友

「其他文章」