ColorUi|使用ColorUI组件 python|小程序

项目初始化请参照：使用ColorUI构建小程序项目_LookOutThe的博客-CSDN博客
目录
一、开发准备工作
1.在前端开发工具中打开下载好的demo目录
2.浏览器打开demo
3.微信开发工具打开上一篇构建好的项目
【ColorUi|使用ColorUI组件】二、开始使用
1.找需要使用的组件
2.复制我们要使用的那段代码到我们小程序项目中。
三、总结

一、开发准备工作 1.在前端开发工具中打开下载好的demo目录我使用的是HBuilderX，该步骤是为了复制我们需要的代码

文章图片

2.浏览器打开demo 官方demo：（ColorUI组件库）该步骤是为了找我们要用的组件
3.微信开发工具打开上一篇构建好的项目我用的是自己的项目，也就是采用的是从现有项目开始。
二、开始使用 1.找需要使用的组件 1.1从浏览器打开的demo中查找需要使用的demo，比如我们需要使用一个进度条

文章图片

1.2可以看到是在basics下的Process模块，点击去后如下图：

文章图片

1.3 比如我们要使用第一个，那么在HBuilderX中打开的demo中查找：
所有组件都在pages下，浏览器找的是basics下的Process模块。
那么就在basic目录下的progress目录中打开.wxml文件。
2.复制我们要使用的那段代码到我们小程序项目中。
文章图片

赋代码：

61.8% 61.8% 61.8%

这里面有一个loading变量，没有值的话，进度条是空，我们可以给这个变量赋值

文章图片

在index.js中，设为true，然后点击保存，编译，效果如下。

文章图片

这是在我现有项目中沾进去的，直接沾到了最后。不影响测试进度条。
三、总结使用还是很简单的。我们首先构建项目，然后在浏览器demo中找我们需要的组件，然后在前端工具中打开的代码里面找到需要的代码，复制到小程序项目中。就可以使用了。
下载的官方代码，每个组件一个单独目录，目录中包含了该组件所有的代码，找起来很方便。比如.wxml中bindtap绑定了一些函数，直接去当前目录下的.js文件中就能找到，直接复制到小程序项目中就可以使用了。