使用ucharts图表时看不懂文档？给你整理了所有的案例，包含点击事件
使用uniapp的相信大多都是移动端，我也不废话，直接告诉你案例怎么找，怎么看，怎么用。在此使用uniapp框架进行演示，你可能会陌生，没关系，它的语法与VUE脚手架一样，什么各种组件各种传参，都一样，唯一的区别就是不能操作DOM，会报错的哦，什么叫操作DOM，你用js去获取元素就是操作DOM，如document.queryselector（“.class”）,这就会报错，就是不行。
先说明，uniapp可以生成全端代码，包含H5，微信小程序，但是官方的ucharts图表在H5下没有数据，或许是因为跨域的问题，如果你现在调出了数据那就继续往下看，没有的话就研究下H5端，下面我用微信小程序进行演示，先给你们看一下效果。
这是微信开发者工具，因为我工作中用公司电脑，所以我开发者工具版本比较老，会和你们的不一样，能用就行。
我们点进柱状图去看一看，案例上点击事件也是有的，其他图先不看了。
我们再看看这个demo项目上还有什么有用的，发现应用还有一个页面多图表的案例，并且还有开发手册
这个东西是VUE的语法，案例也是VUE语法中通用的，多注意跨域问题，相信你知道我要干什么了，没错，直接扒代码，下面说说怎么找代码以及怎么启动工具。
找代码：
工具上有一个路径，我们顺着路径找
在文件夹位置：打开就是当前页面的代码
启动方法：
下载hbuilderx完整版编辑器，下载微信开发者工具，这是两个东西，下载这两个安装好。
安装完复制打开网址 https://ext.dcloud.net.cn/plugin?id=271 会进入以下页面
看下面图片，你可以点击导入项目（需登录），也可以下载压缩包，我按照下载讲。
下载完成后直接解压，把根目录（包含文件和文件夹的第一层目录）拖进打开的hbuilderx中，直接鼠标左键按住拖进工具的左边目录区即可。然后是以下效果
随便点击一个文件打开，然后进行下一步操作 点击运行》小程序模拟器 》开发者工具
如果编辑器报错，如下图 就是告诉我们编辑器缺少cscc/sass环境，无法编译。 我们就找插件，，缺啥找啥，所以做好下载时就下载完整版，避免缺失过多。
装插件
点击编辑器顶部的 工具》插件安装 找到对应的安装就好了
然后从新运行，运行时会自动调起微信开发者工具，以下状态便是启动成功。
你就可以找你需要的代码了，编辑器修改东西，保存后一般不出问题不用从新编译，微信开发者工具会跟着更新。
如果你需要在上面调试接口，请点击详情 或者 设置>项目设置，会弹出一个框，将不效验合法域名勾选上，这样接口才会通。
编辑器启动开发者工具时可能还会遇到一个问题，调用权限，具体我也忘了，但是解决方法很简单，可以百度下，为了保证博客内容的质量，所以并未开启提问，大家可以在我新建的网站中发起提问，社会猿技术网www.shehuiyuan.com
以上内容为段龙龙博客原创，转载请注明http://www.duanlonglong.com/
- 发表于 2020-06-29 23:24
- 阅读 ( 966 )
- 分类：web前端开发
