00:00
哈,另外那接下来啊,咱们就来购买这个商品,那咱购买商品的时候,咱们主要做的功能是我们购买完之后,要把我们的购买信息传送到我们即时通讯云,然后在广播给其他用户,这样的话呢,聊天区里面就会显示啊谁谁谁又购买了一个商品是吧?帮主播增加了人气是吧?主播在谢谢你了哈,好了,那接下来咱们来看一下,嗯,我们应该是点这个小图标,那这个小图标它现在是在我们的,呃,Good,呃,在这个地方,我们给它绑定好这个事件棒的TB。咱们在这儿的话,我得知道我点的是哪一项,将来这块可能有很多列表呀,十项20项,还有这块的话呢,我们是不是应该来一个什么呀,我们在这来一个啊绑定啊handle卡,我们再把当前这一项的话给它传过去吧,列外哎,我们在这里的话,应该我们通过我们这个传单方法data-it特等于个双大括号it特,咱们在我们小程序中啊,传参的话呢,通过这种自定义自定义参数的方法data杠啊自定义属性吗?通过evt.current target. datas.item就能拿到咱们传过来的这一个item这一个值,对吧?因为我这块有一个v wx for遍例的,所以我可以在这个函数中拿得到,其实咱们测试一下,先在这里面咱们测试一下啊,来到这个method中啊,我们在这里也打印一下,打印evt.current。
01:38
啊啊target.data set点啊我们这个it啊,这个EVT来自于这里,来先测试一下好不好用,一边一之后来到这里啊走你嗯点开之后,好,咱们点一下这个,你看拿到了吧,点开这个看拿到了吧,所以能拿到这个池的啊好接下来的话呢,我们就可以在这个地方,我们我们要自己什么呀,不能在这里直接通过TLS方法进行调用,我们可以弹出一个确认框,确认过之后呀,我们让用户啊进行子传,传到副组件中,再让它进行TLS的调用就行了啊所以客人在这里呢,会来一个子传付的一个调用,但是在子传付之前,我可能会弹出来一下受我们这个model啊Wx.show model哎,这个对话框,那在这里的话呢,这一块传一个什么title title啊,这块就是提示啊,然后接。
02:38
下来的话,这个就是我们的内容啊,这个确认购买该商品吗?啊,然后在这儿的话呢,我要success的话,是不是就走这个回调函数了在这里,那我们可以判断if这个data data在这里了,对吧?点confirm,哎,data.confirm这个如果这个值为真的情况下来的话,咱们就应该this.trigger1问他点儿吹哥儿一问他。
03:12
缺一个疑问,咱们触发这一个什么BY这样一个方法,然后在这咱们再把这个参数啊给他传过去好了,另外你看现在的行为就是等我一会儿一点之后弹出确认框呢,你要是确认了的话呢,我就直接来一个自传符,这个BY怎么还写错了呢?好,来自于这个我们的live w SM中,咱们给它绑定这个BY对吧,在这里BY啊棒的BY这样一个自定义事件,然后再去hand到这个by good。嗯,好了,最后的话呢,怎么老想写bug,可来我今天呀,最集中在有不少bug哈,复制一下之后在类务GS的,呃,最后面这里好,我们在这里接收,接收什么呢?我们至少能接收它传过来的这个值啊,在这里子传付拿到这个值的话,就通过我们的evt.d啊就能拿到,咱们最后的话一保存EE咱们来看一眼,是不是能把这个值给我传到我的live GS里面,来来点击之后我要购买这个商品吗?确认嘛,点击取消,但无所谓的点击确认咱们在类务GS的五百六十八九行对不对,打印出来了,哇,我成功了两位,好了,那接下来我们要利用我们TLS的这个方法,其实这个方法我说一嘴,你记住了,你也会了,这是点TLS里面有一个我们的buy这个方法,他说是有这个方法的,那客文就按照这个方法来试一下,对不对?
04:45
我们调用这个方法啊,在这的话呢,我们点次我们买完之后呀,列位我们要干什么呀,买完之后咱们再让这个框的话消失掉就行了,Is受good类似的,给它改成这一个false,来传这样一个BY这个词来E编译之后的话呢,我们来测试一下,点击这个养组,好,咱们在这儿的话呢,来这个地方我点击这个确认嘛,我确认一走这个看一下哈,缺少必要的参数,这个地方传啥呀,肯定传我们买的这个信息嘛,你要不你买啥呀,对不对,你把你这个信息传给他,但这个东西的话,它是一个对象,所以客户要进行一个jason.string find的一个编译啊,我们在这儿转成咱们的Jason字符串,哎,这一次就没有问题,来运行之后重新编译一遍,点击养组,咱们在这里来弹出来之后,我要购买这个商品,确定诶他。
05:45
这块都成功了,所以我这个方法不是我瞎编的,但是好用的列位成功了,我们啊,但这个方法的话呢,后面会有点小问题,我可能呀,监听不到这个事件,就是我这个方法能调出去,但是我在监听广播的时候,我居然收不到,那这个监听广播的方法是什么呢?来来到你之前的代码在上面这块监听这个框框里面啊,在监听这个区里面怎么复制过来,另外在这里它有一个叫做点什么呢?点BY。
06:17
哎,固子按理来说很很搭配了,你看那边摆对吧,我们买了这边的话,那就监听这个摆固子这个事件,那我在这里要能监听到有人,对不对,购买了商品了,我就可以在这里按照之前的流程,之前流程怎么做的呀,是不是我们把这块东西我们一复制,我看一下,把这块代码一复制,我们把这条消息给它推进来就行了,是不是我是这么想的,计划也是这么计划的啊,很完美的计划,我们先不着急往消息区里面添加,就至少能打印出这个log来,我认为这条路咱们就走通了,那最终我来测试一下,我来看一下这个好不好用,重新编译一下之后进入杨佐这里看杨佐准备买一个东西,一点击一确定没有打印一呀,所以这个消息是拿不到的,就很有意思,这个地方啊,所以这个文档倒是这么写的,但确实拿不到这里啊,那在这儿的话呢,就很尴尬,后来科瑞亚就经过自己的尝试,会发现你要是在。
07:17
这个BY这个函数中,你要传一个什么百这一个故字,哎,你要传它的话呢,你测试一下传这个参数的话,一运行之后咱们可以测这么一把,对吧?哎,再次我们体验机添加我们确认购买,大家会发现他居然对吧能收到啊能可以的就传这个可以,但问题是我真正传的时候,我不能传这个白裤子,这个怎么串啊,我应该传这个东西呀,这就很难受对吧?那最终的话呢啊,咱们在这啊也可以看看文档中啊,他确实啊在这里这个方法不太给力啊,咱们在这用的是哪一个呀?那这个不好用的话,我们可以用它这个最后一个方法,它有一个什么呢?叫自定义的,你看一下这个是发送自定义消息并触发对应的这个类型的呼叫事件,所以你只需要把你这个拿过来,你看他给你个例子,这个是疑问的name,这个是真正带过去的参数值,你把它给复制过来,这个是发送自定义的,咱们不正好说要那个按的固。
08:17
怎吗?诶是那个什么是这个购买哈,By goodose啊BY这个下划线goodose,哎是不是对应的是他呀,我们在这边是不是已经监听好了呀,另外用这个方法是万能的啊,这块已经监听好了,自定义事件,把故子咱们在这发送我们的自定义的事件,这样的话列位好好看一看,我们能不能成功重新编译一遍走你。客们在这里真的购买了一个商品了,点击之后我要购买商品,点击确定,大家会发现真的得到了这个商品里面有个Y6值,就是咱们传过去的这一个Y6值,那么把这个Y6值的话呢,就可以大大方方的展示在我们的聊天区里面,给大家看一下,到底的话呢,是谁呀,购买了这个商品啊,它显示出来就可以了啊,所以这块的话就是不断的探索哈,有些小地方确实会有点小问题啊,但是咱们都能够一一的给克服了吧,列外好了,来到这个上面,这一块我们应该是把这源代码给它放出来了,对吧?这一块我们的消息还是一样的格式化,这里咱们在这里的话改成这个什么呀,购买了商品,购买了商品,但这块购买了商品的话呢,我们应该是具体购买哪一个商品,我得写一下吧,所以我在这写一个哈,购买了,诶改成字符串模板写法。
09:41
这个谁谁谁购买了什么商品呢?咱们在这里要对于这个数据先进行一个解析,Per解析data.value6咱们要的是这个name列外来看一下,因为我们传过去了的话呢,它是这样一个字符串,所以可在这先进行一个Json的一个per的一个解析,解析成对象之后点name,所以我会显示出到底我购买了什么商品,最终的话呢,咱们来测试一下啊,就是我们显示在我们的聊天区,并且广播给其他用户啊,你让其他用户在看直播的话呢,他们就能收到这条广播呀,一点完之后对吧?哎,购买了商品AAA啊,然后在这里的话呢,点击之后购买了商品AA bbb,那其他用户看见的应该是兵购买了商品AAA,隐兵购买了商品bbb啊,这样一个显示界面列外好了,这就是咱们即时通讯中的啊,在我们聊天区的这个展示,那最后的话呢,咱们就把这个数据的话呢,都已经购买完了吗?然后咱们呀,就给他。
10:41
到自己的数据库中啊,当然大家也可以在这一块加上自己的一些支付的一些业务逻辑,那这样就真的很完美了,就对吧?OK,咱们在最后这里的话呢,把这些东西存储到自己的数据库中啊,无非就是我们在最后这里咕噜过来啊,也一样的哈,可能在这里跟之前的话呢,如法炮制吧,A think,然后的话我们在这里a wait等着我们的model到点BY这一个good这一个方法,那咱们在这儿的话呢,发起一个请求,咱们还是一样的哈,From andd,从哪购买对不对?this.data.user infer,然后点我们的user ID啊,然后对应的我们的two_ID,然后对应的是z.data点我们的group in,点我们的owner ID啊,从哪到哪来购买,对吧,我是在哪个人的直播间里面。
11:41
买了这件商品,然后还有对应的咱们的固执的这些信息,咱们都给他传过去,三个点,咱们把哪一个信息传过去,就把这个对象展开了,因为这个对象里面的话呢,就是当前购买的这个什么ID name,还有这个什么price,咱们都给他传过去,还有创建时间都传过去就行了。好了,最终的话呢,我们可以把白故子这个啊模型咱们给他写一下,然后在我们对应的后端接口啊,以及数据库创建完,那我认为啊,是不是我们就完成了啊这样一个购买的整个的链条啊,我们在model.gs中啊,我们的模型在这里。
12:24
是不是可能在这里就可以拿过来这个方法咱们去粘贴一下其他人的对不对,我们之前写过了,诶这个就不错嘛,复制过来,粘过来,粘过来好,在这里的话呢,咱们可以解构出来我想要的东西,From ID啊,To ID,还有我的name price,还有我的ID值,咱们都给它解构出来,来了位啊,From ID to ID name price,这个是从咱们那个对象中解构出来的,那接下来咱们朝这个白固子这一个接口啊,发起这一个请求是吧,好,Poose的请求friend TOD没有问题,咱们在这写一个good下划线内幕就是我们这个内值good下划线这个price,就是我们这个price这个值,然后再来一个下划线ID,就是ID这个值,Postose的给你的这一个后端接口,后端接口再拿去写列呗,来到这里,咱们把其他的先暂时关闭,打开我们这里。
13:24
对吧,新建我们这个BY固子点GS对吧,而在这里的话,我们就可以参考其他的,比如说我们参考这个当年发送礼物这块代码,来到我们的把故子GS中,咱们给它覆盖一下,来到这里来改成你的这个把故子啊。好写好后再把这个小模块的话,咱们给它导出去,诶是白裤子对不对,然后然后在这里接收我们的IQ body,然后再解构出来这些内容就可以了,老规矩先把这块注释掉,先能不能打通这条链路啊,在这里咱们打印一下我们的IQ body,好把这个东西注册在我们的这里,我们回到这儿来继续的引入啊,我们这个API斜杠下面的我们这个叫把裤ose,然后把这个模块啊赋值给把固子这样一个临时变量,最后我们再poose的再来来一个。
14:25
是不是列位,哎,这样的话就可以,诶我这个保存之后我来测一遍了哈,所以我来从这个地方重新的编一遍,看这条链路啊,咱们能不能打通了哈,走一下杨祖这里,好,我们可以选选这个吧,选第二个商品行吧,BB这个商品点一下确定吗?确定好了,这块成功了,看一下我们的后端呀,是不是已经成功的接收到了呢?看一下有没有来from ID,从引兵到养组啊BB22啊good ID是个九,哎全部得到了,那接下来就在我们的把good字这里,咱们把对应的这些字段的话呢,全都给它怎么样解构出来得用呀,对不对,Price你得用这些字段嘛,都解构出来,还有这个good ID这个字段咱们也解解构出来,那接下来的话呢,就是往数据库里面进行存储工作啦,哎,这里的话就是我们要把往哪个表里面存呀,把这个。
15:25
下划线固S这张表里边进行存储就可以了,对吧,然后接下来就可以在这里的话呢,往里面进行存啊,我们来看一下这个,呃,ID啊,我们这个是自增长了,将来设置成自增长了就可以了,From ID to ID,然后再就是接下来的我们有一个叫good name啊,然后good price,还有一个ID啊,然后在对应的还有一个create_time就可以了,那这样的话,这分别是几个,12345677个,那么对应的就加上两个呗,对,加两个,那这就是在这里no,一开始是个空的这个啊,From ID没问题,To I没问题,然后good name,然后这一个price,另外还有最后一个good ID妥了,来,能不能对号入上座,看这里,看这里能不能对号入座。
16:25
它们对应的啊,少了一个逗号。ID啊,我们空它会自增长,From ID to ID good name good price,还有good ID啊,我们最后一个创建的时间朝白裤子这张表啊进行插入,这条数据一保存之后完活,剩下的最后一点就是去你的数据库中来创建出这张表来,咱们就成功了,列位来点击之后打开我们这里,表明是它子符机的话呢,我们还是一样的选择utf utf8这里,然后呢,点击之后啊,然后在列信息中的话呢,我们就找到新增我们的ID这一个字段,然后在这里呢,是in特类型的,我们在这把它勾上我们的主键,然后我们让它自动增长,嗯,然后再接下来就是我们正常的了啊,From ID啊,From_ID然后我们在这里word叉类型的长度是100,然后再来一个新增一个to ID。
17:29
对吧,我们的类型的话也是what差类型的100,然接下来这就是我们的good name,哎,Good name这个也是what差类型的吧,嗯,然后对应的这个长度的话呢,是100,然后再来一个good price啊,我们的价格哈,Price price这个的话咱们选择是特类型的了,行吗?那在这里的话呢,这个不用填了,再接下来是我们的good ID啊,我们商品的这一个ID,它在这里的话呢,也是一个int类型的,最后再来一个create下划线,好在这里选择一个date time,好把这几个的话呢取消掉,可控啊,不可控啊,然后接下来最后我们来看一下整个啊,再没有什么问题了哈,这个ID和price是in特类型的啊,还有这个ID是自增长的,好,最后点击提交,那就可以把这个数据的话呢创建出来,诶把这张表的话,咱们。
18:29
创建好了,那删一下的就是来跟康做测试吧,你这块这个后端接口不也就绪了吗?你的小程序端重新编译一遍,再次进来,我们开始杨总好了,点开这个一个商品,我们点第一个商品和点击确定吗?确定购买,诶整个链条走通了,最后我们测试下数据库中如果有这条数据,那我们不就成了吗?列外测试一下来从这个到这个对吧,没问题,Good name good price价格一块钱,Good ID是八,还有我们的创建时间是这个事,诶挺好呀,另外是吧,就这样的,然后你在这里再测一下,说我们如果改一下,比如说我更新一下,我更新成这个,111点击确认了,好,我们在上架新商品,我们的小程序端有商品更新,点开看一下,哎呀,商品恢复原价了,很遗憾,别人在点的时候,他此时购买的话就是111块钱了,最终在咱们这个。
19:29
数据库里面对吧?啊,就会发现啊,你刚才那个时间点你不买,你现在可能好恢复价格了,变成111你倒买了对吧,那没有办法啊,所以最终数据也都存好了,列外,你看这就是咱们的小程序啊,到我们啊整个这一个电商的这个行为啊,大家后面的话,大家可以再维护这张表啊,在分析到底谁购买了多少件啊,有人也说可们你这里面你也没写咱们的这个什么点开之后不得有个左减右加购买数量等等的,再算总金额等等的啊,就变成了一个小程序的页面开发了啊,它就没有什么太多技术含量了,对不好了,呃,那最后的话呢,咱们把我们这个vuee这个项目打包吧,为什么要打包呢?因为将来我不可能说还要把这个view项目再部署一下,我准备把这个项目呀,打包完之后呀,最终呀,放在我们的no的这个环境下,哎,放在这个我们之前no的环下这。
20:29
来说咱们就保证我只有一个服务端,将来部署到我们的啊腾讯云函数上,然后再是通过我们的小程序端来去访问它,对吧,咱们就这样来,就这个产品的话呢,View这一块我们需要打包了哈,那客户在这里的话给你打包,呃,我们在这里可以把之前的给他停掉了啊,因为不需要这个了,是不是,那我停掉之后就断了吗?好,叉掉之后断开了,而在这里大家也不用担心说哎反向那里不就完了吗?看们咱们都部署到这个noe端了,还有什么跨域问题呀,是不是好在这里来一个n PM run不要的,他在这里编译的时候啊,你列位啊也别闲着,为什么别闲着呢,干嘛呢?呃,在这里的话呢,你得让你的这个node项目的话呢,支持静态资源目录,咱们把public文件夹做成咱们静态资源目录,然后在你的app.js中的话,是不是我们得通过我们的点static方法来进行支持呀,那。
21:29
这个时候客文在这里就可以通过我们的app.use我们的express.static我们把我们的什么呀,Public这个目录的话呢,就做成啊,咱们的静态呀,资源目录列外,你看这样可好是不是啊,诶只要加上这样一句话就可以了,诶这个这个地方可能不用加这个型号也行,它会找咱们当前的这个目录的,好咱们来测试一下哈,我在public布Li个下面我新建一个aa.htmmr,我看一眼好不好用呢?啊,我现在服务器是启动的,如果能访问到就是我们的静态资源文件夹是没有问题的,Local host的9000-aa.ht另外成了,那就哎咱们来看一下,刚才我们这个编译完的,我这块编完了吗?我看一下。
22:21
哎呀,好像刚才这块的话,编译这块出问题了哈,没关系,我再重新编译一遍,我重新编译一下啊,刚才我电脑也卡了一下哈,估计编辑失败了,那咱们在这稍等一下好吧,啊,那可能可能在说话的时候也能卡住,但没有关系,写着干啥呀,唠唠嗑呗,写了这么长时间代码都疲倦了吧?列位好了,这一次啊,总算变译好了列,那接下来的话呢,咱们把它生成的这一个Dis的文件夹的话给copy到这个public下面不就行了吗?来找到我的代码区,咱们把封巢system d的文件夹CTRLC复制过来,咱们来到我们的呃后台系统这里,咱们把这个public里面的A咱们给它删掉,把这些给它替换过来。列位接下来的话呢,我们最后做一次测试,这个目录应该就没什么用了,咱们现在整个的静态编译完了。
23:21
View项目都在public文件夹下了,而且没有跨越限制,朝自己请求,有什么跨越限制呢?所以在这里我已经断定啊,我的这个风巢system已经关掉了,现在叉掉了,已经只开的9000这一个服务器了。好,我们来测试一下我们的后台系统是否能够正常工作呢?来local host9000回车来直播带货后台系统咱们在这里的话可以把整个链条走一遍试一下啊,我们在这里的话可以更新一下,比如说这个价格的话,我们给它更新成这个333,好点击这个确认准备哈,上架商品选中给养组上架商品好走,咱们来看一眼,哎呀,这这一块是我小程序卡住了,我小程序卡死了,哎呀,小程序怎么卡住了呢?
24:14
看来刚才给电脑给卡了,我这样要重新再关掉这个项目,再重新再进一遍吧,好不好,另外好了科们已经重新启动完了,再点击进来之后的话,那咱们看一下,看一下这个商品,你看改成333了,已经就说明刚才我那套流程是对的啊,你要再看实时性的话,咱们再给他改回来,改成一块钱啊,又到了特价福利时间了,一块钱你买不了吃亏,买不了上当,咱们上架商品,咱们来到小程序端,商品又更新,已经改成了这个一了啊,所以最终的话呢,咱们把view项目的话呢,就上线了啊,上到我们的这个啊之前的那套路的项目中了,我们把它编译在public文件夹下,并开启的支持静态资源访问的这样一个功能,那最终咱们再把它给部署到我们的腾讯云函数上,是不是离成功就会更近一步的压力外,好了,咱们关于这一小节呀,咱们就说到这里了。
我来说两句