00:00
接下来呢,我们来开发购物车的页面功能。打开咱们的这个代码,我们找到APP Jason啊,先调为一一的话呢,我们最终啊,他就会每次刷新来到购物车的页面,方便我们进行调试。好,那么接下来呢,我们要做的第一个功能就是数据展示啊,做任何功能之前呢,我们首先做的是数据展示,展示的数据我们才能对它进行其他的一些改啊,删啊等操作。来到AP papi ready啊,我们可以写我们相应的功能。Apid。好,请求地址,待会我们来写,还有请求的,呃,这个方式那肯定是get。对吧,然后后面跟一个回调函数,当然回调函数我们要写成箭头函数啊,这样才能确保这个这次指向。咱们呢,请求出来的数据呢,我们取名字就叫卡,然后呢,后面跟着参数是error,如果看this有值,那么请求就成功的,那么我们好去呃,更新数据,更新数据就好了啊。
01:16
好,Else呢,就是有问题,我们就apidllert。它这个提示不是那么友好啊,我们来一个message值为呢,就是这个L。好了,现在关键是这个请求地址,我们要点上去。找到这个接口文档啊,直接找接口文档就好了,这个get卡啊,不是get啊,就是你是请求地址,同时我们要传一个is order的参数为false啊,Is order为false。嗯,我们来试一下,把整个地址都复制了,这样就不用这么费劲了。好,那么这样的话呢,他请求成功就会更新这个卡,更新好卡之后,我们来到上面进行便利展示。
02:07
来,呃,整个媒体展示的就是整个food的item food item weper,我们we for。B卡变出来的就叫cuts in啊,那么甚至你还可以给它添加一个P属性啊,对吧,等于cut ID。好,然后呢,接下来我们去整合它的内容,我们需要整合的就是这个,它的一个标题叫class title。然后往下走,下面呢,就是便利的这个食品数据啊,便利的食品数据。那么我们也是保留一个V-for病例。这就是的food。编译出来的就是负的。
03:00
同样的可以考虑给它添加一个技术性附的ID,好编辑好了之后呢,我们接下来对里面的数据操作啊,这是它的附的图片。Cover。然后里面再走,这是负的标题。规格的话呢,实际上我没有这个数据啊,所以说咱们这就不写了,然后呢,还有它的价格是price。然后往下走,这里有它的数量是。然后呢,到底是否选中啊,这里会有一个是否选中,其实还有一个图片叫no check。代表是没有选中一个,选中一个没有选中它们是一个这样的切换关系啊,他们应该存在切换关系,当然我们也可以直接在这里去给他做操作。
04:04
看它到底要不要加这个啊,Not,那么看的就是负的is c。It s。是T的,如果为true,那么什么都不用加,如果为false的话,那么我们才需要加一个not,代表它没有选中。啊,好了,那么以上呢,我们就。呃,完成了,所以说我们就可以去看一下效果。哎,你看这里呢,我们就遍辑出来了,它的这个价格,我们看一下是不是哪里写错,Sell price or sell price。是不是这样写的?销售价格OK,那么左边这里我右边这里我们就已经全部编辑出来了,对吧,没有任何问题,它的一个名称图片啊,以及左边的右边的标题价格数量啊,全都是正确的,然后默认的都是选中的,所以它这个选中状态都是勾。
05:01
那么后续我们到时候尝试更新一个不行状态,那么自然就会出现差异了。好呃,那么这个就是一个计算啊,那么下面这里呢,我们也可以做一下便利展示,做完了之后,下面我们就一起做一下把。底部的这个价格和已选择的数量也完成一下。
我来说两句