霍常亮淘宝客app开发系列视频课程第35节：工具类原创

Hello，大家好，我是火尚亮，非常高兴和大家继续分享关于淘宝客APP开发的课程。那么我们在上一节课呢，我们已经通过API以及一些云数据库实现了将在数据库中展现的选项哪啊这些标签展现在咱们的前台，但是呢，我们会发现，如果说你每一个API调度都写这么多代码的话啊，那么你在。首页里面你看起来就会比较臃肿对吧？啊，不利于我们后期的维护，所以呢，我们通常呢，会把和API相关界面呢，单独给它放在一个工具类里面。这就涉及到咱们今天的一个新的内容。我们呢，可以把它单独的存放在一个坑里面。

这个文件夹呢，咱们可以用它来存API，相关的内容就专门用它来存API啊，我们俗称叫做工具类。然后我们在这里可以新建一个文件啊，JS文件。名字呢，嗯，因为我们现在是讲的关于卖地插的这个页面，对吧，咱们在这里就写个首页。之后我们点击创建。然后呢，他会在底部给你创建一个ID插件GS，我们需要做的就是将之前啊，就是咱们昨天所写的这些代码和API相关的给它翻到这边来，那么怎么翻呢？我们现在呢，可以在这里写一下咱们目标的一个效果啊，咱们就来个一行。有没有Dollar API？

还没有，没有的话，我们手动放电一下。然后里面是一个括号，里面是一个大括号。然后就是下面这个Z，等他执行完了。异步。之后是里面一个。然后一个借条函数。

好的，那我们呢，在comment.s里面，我们可以先做一个，呃，说明一个函数，说明一个一个函数，所以。名字呢，这里有一个名字叫。等于一个函数。打错LA。然后后面一个大括号。我把画打开。

之后。那么我们这个云函数里面，我们要封装的是什么呢？就是咱们前面的这些。对吧，咱们需要把前面的这些给它装起来。从这到这。剪切，然后给它放在这个函数里面。之后啊，我们在这里呢，会有一个参数。对吧。然后我们在下面的。内蒙女啊，也给他。声明一下啊。然后呢，我们再声明一个，返回一个新的。

之后还是一个箭头函数。打开，那么我们可以把下面的这些全都给它装进来。嗯，可以格式化一下CTRLK。在这个位置呢，我们还可以给他传个参。那我们刚刚初始化格式化了一下，然后这里面。两个参数。一个是。

还有一个是。这个promise呢，它是一个构造函数啊，这个现在大概听不懂没关系啊，以后你用的多了你就知道，暂时先这样记啊。那么我们在这里呢，也可以把它先删除掉。呃，这样吧，我们。先把它删除掉啊，先剪切一下，然后呢，咱们用一个。我还是把它放在下面，把他屏蔽掉吧。然后在这呢，我们可以用一个if函数。

后面是一个大括号，大括号打开。然后if else对吧，这个咱们之前已经讲过了。这里呢，If什么呢？当什么情况下我们执行试的操作，咱们还记得咱们之前写的时候有一个状态码，我们可以用状态码来识别，对吧，状态码等于200啊，我们来看一下咱们之前写的这个。对吧，咱们之前写了一个状态码，那么我们可以用这个状态码来做一个判断。是吧，Code。判断的时候是用什么，用三个等号等于200对吧。

那么我们这里不能直接写C，因为我们前边是在。获取到这个2S的基础之上进行了操作，我们想要的结果呢，它并不是说整个里边只有一个cer啊，它是在整个里面的一个。二里面的一个poer。对吧，那我们在这呢，也需要加上一个res.C等于200，然后在这个的基础之上啊，如果说它等于针，我们执行一个，如果不等于针，然后我们再执行一个。我们在这啊，你上我跟你站着对吧。第六个。然后失败的时候是。这里呢，成功的话，我们想要的是什么，就是一个结果对不对。

在那个res里面。想要的是他。这里也是一样，还有S。然后呢，我们下面可以理解为是在执行一个点。下面呢，是。然后写到这儿呢，可能又有同学会问，老师，我这块我看不懂什么字哪，Catch啊啊，这些意味着什么，代表着什么呢？呃，我们呢，给大家整理了一个资料啊，我们可以看一下这个幻灯片。

呃，Promise呢，它是一个构造函数啊，有多种静态方式，然后呢，在原型上实现了这三种方法。我们来看一下，其实我们对比着这边我们就非常好理解了，那我们之前讲过跟else无外乎就是当它。是的时候执行这边，当它否的时候执行这边，对吧，那么我们对照这个方法来理解，这就是属于接受，Catch呢，通常是指被拒绝，而这个。Finally。他呢，咱们没有在群里进行展示对吧，咱们目前呢，就写了一个暂时的一个，看这个finally呢，是指你只要结束了，甭管你是成了还是不成啊，他都会执行这个回调函数。

理解吧，那没关系，不理解没事，咱们先这样记着啊。咱们在这啊，点catch。这里面一个箭头函数。有点乱啊，我再重新写一下。对吧，这里面呢，是一个箭头函数。当这里是错误的时候啊，我们获得到这个错误的值，也要给它来一个。

把我们那个错误的值再一下。好，那么我们上面呢，就算是基本是写完了，然后呢，我们写完是写完，可是想要调用的话，我们还需要一个导入导出，对吧，你在API这边需要有一个导出。这边我们保存一下这头呢，咱们算是导出了啊，就是说允许咱们能够正常的调用这个JS，然后呢，我们还要有一个界面进行一个导入，对不对。

那么我们现在呢，回到这边。之后呢，我们现在想要调用一下啊，这次API啊，想要调用一下它，我们看看咱们先输出一下啊，咱们先输出一下这个结果。看看输出的效果如何？A。然后现在保存一下。

诶，那这个是好像是这边是没有成功的调用出来啊，好像是没有生效。设备信息啊，那就是说明我们没有生效，我们现在只是到了设备信息这里。我们在这边。写完了一个导出，然后我们再。慢点，里面好像还没有导啊，还没有导入引后的，我们在里还再加一个后。那么上面两个呢，是系统自带的啊，咱们不用管它。

这个呢，就是API。然后from就是从哪。后面呢，就是位置。对吧？啊，我们写的位置就是common.api所以说我们直接选中。没错吧？不对啊，应该是一个目录的形式，我们这边怎么会直接出。哦哦，是这里啊，我们应该是建一个API的文件夹啊。

然后我们把那个index装到这个文件夹里。好，这个时候我们再重新敲一下这。这次应该是这。直接流到API，这就可以。上面都是到一个啊，目录的一个位置。之后呢，我们还需要进行一个实力的绑定。

好，我们现在在保存看一下，哎呀，这边有一个报错。到了A。号。还是报错？

啊，应该是这里。If health，这是if。这是。他应该是放在下面。好，我们再保存一下。啊，这次没有报错了。这次是没有报错了，但是我们上面的信息还是没有显示出来。我们再来倒一下是哪里的问题。我们这边也已经。

注错了，然后我们在这头也是有一个调用。哦，这边呢，我们只是输出了一个日志啊，我们现在呢，只是输出一输出日志也不对啊，输出日志你至少应该上会看到这个日志啊。加一款。API日志输出。到这里啊，可以输出了，我们看一下输出的东西。进入到了。这次API根据这个API咱们进入到了。这个API的页面，然后呢，我们可以获取到。他的信息。是否是成功？

我们先继续往下写一步。到了API。里边我们要返回一个二加S。之后减函数。那我们在这里呢，可以把这个。

参数传进去。然后这边也把结果打印出来。好，我们现在清空，然后再来保存刷新一下。那这里呢，有一个报错，我们看一下他报的是什么。获取前把数据成功。我们这边呢，是已经获取到了，但是这里面有一个报错。

我们找一下这个位置。啊，这里应该是比较的结果的一个。再保存一下。对吧，这次呢，就没有报错了。啊，我这边看。我们所获取的这个都已经获取到了。好的，那我们在这里呢，在控制台里面我已经看到了啊，我们想要的这些淘礼金呢，手单礼金呢都有了，但是我们在前端还是没有看到，对不对，那么我们就需要把他在前端进行渲染一下，我们还是在。

这边。整一下啊，咱们怎么把它给整到前端显示。因为我们在这呢，咱们获取到这个瑞之后，咱们只是简单的给它输出了一个日志，对吧，但是我们不能说光看到这个日志，我们得把这个日志里面所有的这个选项啊，就是这些ID啊，这些名字啊，得把它存到上面来啊，展现到上面，所以我们在这需要写一个展现的一个功能。之后那么我们这个位置。它所对应的是什么？

是一个table list。对吧，那我们就得把这点table list。获取成这个。再保存一下。现在这个时候就已经出现了啊。好的，那么这节课呢，我们主要跟大家讲的就是关于一个API的封装啊，感谢大家关注，我是霍长亮，拜拜。