钉钉小程序学习日志

本人是第一次制作钉钉小程序，记录一下学习过程，希望能帮助到后来学习者。

---

第一天：

首先，我们需要进入钉钉开放平台的网站，可以看到有小程序介绍及JSAPI一栏，此栏中有小程序的简单介绍，大家可以仔细阅读。不同身份的钉钉开发者可开发不同类型的应用。开发者关联的组织根据需要完成相关认证后，开发者才可以进行应用开发。

之后，下载小程序开发工具。下面是下载钉钉小程序开发者工具的网址，大家跟着网页的叙述就可完成软件下载。

https://developers.dingtalk.com/document/app/mini-program-development-tools

小程序介绍中我个人认为比较重要的就是小程序的目录结构（其实也是因为我个人一直记不住）

 app因为是描述整体的程序，所以他的app.js、app.json、app.acss都在根目录中

page文件用来描述每个小页面，其中axml文件中主要是书写整个页面的结构，js主要是整个页面的逻辑。

为了更好地学习，可以打开小程序开发者工具中给的demo分析一下，首先打开文件app.js分析整个页面的公共设置，在该文件中引用了之前书写的子页面，然后是首页的设置，底部的三个小部件，设置了activeicon，使得图表点击是可以发生变化。

因为本人第一次做前端页面设计，根据我个人对代码文件的分析，我认为前端页面设计类似于一个迭代算法，算法的入口是首页页面，出口是最后的子页面，当然子页面中也可以迭代许多子页面，并且每个页面都可以有page-section。（有理解不对的希望大家批评指正）

 demo中的image和page文件都比较好理解，但是util文件个人还没有理解透彻。可以看到很多文件中都引用了util中的文件，所以我认为util中可能是书写了几个公用的功能，后面再研究一下。

在看完demo后我开始完成自己小程序的设计，首先我先讲demo中原有的代码进行一个移植，完成拙劣的模仿，但是在移植的过程中我遇到了button无法点击和搜索栏无法输入搜索内容的问题，留在第二天解决吧。（希望知道的大佬们也可以告诉我一下，感激不尽）

第二天：

首先解决昨天遇到的button无法点击和搜索栏无法输入搜索内容，我先检查了button的语法跟官网给的语法是否一致，检查无误后，对disabled参数进行了修改发现没有效果，所以我就考虑是否是整个页面进行了一定的设置导致出现以上两个问题，我先将button的一段代码拷贝至其他页面，发现其他页面不存在以上两个问题，所以确定了我的猜想：是整体页面的设置导致了无法点击，所以我在页面设置代码部分进行了修改，但是还是没有解决问题，最后我用了最笨拙的办法，就是将之前拷贝成功的那个页面移植到首页，将首页进行了重做。

第三天：

在完成了前端页面的基础设计后，开始学习前端与后台数据库的连接， 首先我尝试使用官网给的demo进行学习。

https://developers.dingtalk.com/document/tutorial/develop-mini-programs?spm=ding_open_doc.21783679.J_5712166950.2.75c34ce9jUtgOK

在此过程中，遇到了无法返回用户的id与相关信息，在一番思索与查询后，发现应该是后台权限未开通，在完成后台权限的设置后成功的到id与相关信息。大家记得一定要在后台先把能给的权限都给上。接下来，我又找了网上的一个例子进行实验：

https://blog.csdn.net/weixin_44019875/article/details/118927028

在实验该例子中发现了前端无法正常显示后台的数据，以下是我的解决思路：

首先，考虑问题是否出在httprequest失败，查看httprequest的代码，发现在选择语句if中的条件有res.data.success，但是在调试器的data显示中并没有success一项，所以将if条件改为res。

其次，将数据赋值语句中的res.data.data.***全部改为rea.data.***因为在调试器的data显示中，我们的数据在集合的第一个子集中（跟demo对比中得知应该去掉一个data）。

最后，完成以上两个修改后得到的前端页面，hidelist已经显示，只差数据没有填充，所以我考虑可能是页面结构axml中出现了问题

经过对技术文档中列表渲染部分的学习，我发现代码中可能是少了指向数组的参数，所以我给每个属性前加上了item.***，经过尝试成功解决了前端页面不显示数据的问题。