jiaminghi/data-view是什么？（DataV，dv大屏数据可视化开源组件库）

待我称王封你为后i 2023-10-04 22:25 74阅读 0赞

**简述：相信大家在平时工作中，难免会遇到开发大屏的需求，页面中有很多比较炫酷的CSS效果，这里给大家推荐一款大屏数据展示组件库，里面有各种边框、装饰、图标、飞线图、水位图、轮播表等等，支持vue和react，有很多炫酷效果，下面大家介绍一下；**

![a0639300adae4fe1baff7614767df98d.png][]

####  ####

#### 具体使用方法： ####

**1、安装**

//npm安装
    npm install @jiaminghi/data-view
    
    //yarn安装
    yarn add @jiaminghi/data-view

**2、引入**

//全局引入组件
    import dataV from '@jiaminghi/data-view'
    Vue.use(dataV)
    
    //按需引入组件
    import { borderBox1 } from '@jiaminghi/data-view'
    Vue.use(borderBox1)

**3、使用（直接复制标签使用）；**

![7de7e3f9b11b42c7b911e7f58440e33c.png][]

**4、下面这款Vue的开源大屏就有不少样式使用的就是，DataV，仅供参考；**

**![fcb0bfef2231465c8cc798e9a8401e6e.png][]**

**该项目开源地址：**

[Vue大屏![icon-default.png_t_N176][]https://gitee.com/MTrun/big-screen-vue-datav\#https://gitee.com/MTrun/go-view][Vue_icon-default.png_t_N176_https_gitee.com_MTrun_big-screen-vue-datav_https_gitee.com_MTrun_go-view]

**更多炫酷效果，详见DataV官网：**

[ DataV官网![icon-default.png_t_N176][]http://datav.jiaminghi.com/guide/][DataV_icon-default.png_t_N176_http_datav.jiaminghi.com_guide]

感觉有用，就一键三连，感谢(●'◡'●)

[a0639300adae4fe1baff7614767df98d.png]: https://img-blog.csdnimg.cn/a0639300adae4fe1baff7614767df98d.png
[7de7e3f9b11b42c7b911e7f58440e33c.png]: https://img-blog.csdnimg.cn/7de7e3f9b11b42c7b911e7f58440e33c.png
[fcb0bfef2231465c8cc798e9a8401e6e.png]: https://img-blog.csdnimg.cn/fcb0bfef2231465c8cc798e9a8401e6e.png
[icon-default.png_t_N176]: https://csdnimg.cn/release/blog_editor_html/release2.2.3/ckeditor/plugins/CsdnLink/icons/icon-default.png?t=N176
[Vue_icon-default.png_t_N176_https_gitee.com_MTrun_big-screen-vue-datav_https_gitee.com_MTrun_go-view]: https://gitee.com/MTrun/big-screen-vue-datav#https://gitee.com/MTrun/go-view
[DataV_icon-default.png_t_N176_http_datav.jiaminghi.com_guide]: http://datav.jiaminghi.com/guide/