00:01
哈喽,各位小伙伴们大家好。那接下来啊,咱们呢,去聊聊PU form当中的这些业务。那咱们呢,先看一下呢,已经完成的这个项目。那当然咱们的注意力啊,还是放在这个SQ管理队。那首先说啊,用户啊,可以选择123这三个三级分类。比如说啊,咱们选择手机。手机通讯以及手机。那咱们呢,先分析哪里的业务呢?先分析添加PU和修改PU这块的业务逻辑。那么在前面的时候啊,咱们的经常啊,先处理添加po的业务逻辑,那么如果添加完成了,那修改呢,瞬间也就完成了。那这回呢,咱们呢反其道而行,咱们呢先做修改PU的业务逻辑,那么同样的道理,修改完成之后,那你的添加po的业务也就完事了。
01:08
对吧,那咱们先看一下修改po的业务逻辑。那首先说啊这块呢,你要想明白一件事。虽然说目前咱们在这里展示po列表,比如说展示这三个类。那比如说你想修改主线程,这个po就是这个类。那你想想,那你一定当你点击这个按钮的时候,是不是把你要修改的那个类也是那个po是不是要传进来。因为你得知道你要修改的是哪一个。那假如说咱们就修改主线程这个类,那当你一点击的时候,咱们看一下。那咱们呢,打开咱们的控制台。对不,咱们呢,去看一下的,审查一下它的network面板。对吧,那咱们呢,一点点去调一下手机手机通讯手机对吧,那么老师呢,先把这块呢,先给它清了。
02:07
哎,给它往底下拽着。咱们呢看一下,比如说修改主线程这个po点击修改。那你会发现一件事啊,什么事。当你一显示p form这个组件的时候啊,你看底下这个network控制面板。他们发了几个请求呢,他是发了四个请求。对吧,那这四个请求分别是什么呢?咱们的一个一个的去说的说。咱们先说谁呢?先说这个接口,叫做得到品牌列表。那这块呢,获取到的是什么数据呢?咱们可以看一下。那么当你显示po form这个组件的时候,你看品牌的这个下拉框是不是在展示所有的品牌。对不,那也就是说当你的po放子组件显示的时候,你要获取到所有的品牌,在这块的下拉框是不是要进行展示?
03:05
那所以说品牌的这个下拉框,这里面是需要发请求的,那咱们呢,需要用到的接口是谁,用到的接口是它。对不,那这个接口呢,老师呢,先把它呢放到咱们的笔记当中,对吧,咱们呢也去做一下笔记。那首先说品牌的数据啊,品牌的数据。是需要发请求的。而地址是谁,是他?对不,那所以说这块呢,需要一个接口。以及咱们再看一下底下这里看这。这块呢,他还发了一个接口叫做base Co at tr list。Co是啥?是销售?A tr是啥,是属性?那这个接口在干什么呢?那这个接口呢,是获取你整个平台当中所有的PU啊,就是所有的销售属性。
04:02
那这块呢,老师呢,也写一下子,这块呢,还有一个接口也要发请求写一下。就是获取,哎,获取平台中,哎平台中。写一下平台中那么全部的销售属性。那这块呢,老师呢,要说一下的。咱们这个项目当中啊,就是所有的销售属性呢,一共是几个呢,一共是三个。OK吧,那么它所用的接口是谁呢?用的接口是它。哎,找你那这个呢,咱们呢,也给他放到咱们的笔记当中。那么什么是销售属性呢?这里面呢,老师说一下子你看啊,你看它的数据。咱们呢,可以看一下它的数据,什么是销售属性。就举个例子,比如说手机。那手机的销售属性有什么?比如说有你的这个手机的颜色,版本和尺寸。但是一定要注意咱们。
05:01
这个项目当中销售属性最多,一共就是几个,一共就是三个。OK吧,所以说呢,咱们的销售属性的值也要获取到,那一定要注意那平台当中所有的销售属性一共是几个,一共是三个。对不,那这个代表的是什么?这个代表的是主线程这个PU啊,就是这个类已经有的销售属性是几个是他自己的。对吧,那咱们可以看啊,随便找一个,就是自己的销售属性是有俩,但是一共是三,那还有一个没有选择。对吧,那就是尺寸。那table这块展示的是啥?展示的是你这个,你这个当前这个类。自己拥有的销售属性是几个是俩对吧,那一共是几个,一共是仨对吧,他自己已经有的是有颜色和版本,那还有一个没有的是是尺码。对不,所以这块呢,一定要注意一件事,什么事,咱们整个平台当中销售属性一共是几个,一共是三个。
06:06
啊,这是他。那这块呢,老师呢,再看一下他还有两个接口,那咱们呢,还是要看一下这个老师往底下拽拽。就到顶上呢,还有个接口叫做这个,那咱们看这个接口叫做什么,叫做得到SPU通过啥通过ID。对不,那所以说这块老师呢,把它呢也给你拿过来,这个是什么呢?哎,写一下子是获取,哎某一个。某一个po的信息。对不,那这个接口呢,咱也给它放在这儿,什么意思。那比如说对于某一个。Po对吧,就是某一个类而言,比如说你是主线程,那当你一点击修改pou的时候,跳到咱们的s po form这个子组件的时候,你是要展示当前这个类的信息的。
07:00
对不,比如说这个类,也就是说这个po叫什么,描述的信息是什么,那你也是要发请求的。而且是通过你的ID去获取相应的你这个po的信息进行展示。只是他那以及咱们这儿呢,其实还有一个接口,那这个接口是干什么呢?咱们可以看一下,还有个接口叫5092对不,他在获取什么呢?获取你这个po的图片你看啊。咱们PU这块是不是有个pou图片在显示照片墙,那其实也是通过接口获取到的。那这个呢,咱们呢,把它呢给它拿过来,那这个是什么呢?是获取PU图片。对不,那他们也是需要发请求的。那所以说啊,你看咱们的这样的一个不经意间的一个操作,你看一下,比如说当你选中的是po哪个呢,是主线程这个类。当你点击修改的时候,你要注意,那这里面要发几个井是四个。
08:04
对不哪四个,第一个获取你当前po的信息进行展示。对不,以及获取你品牌的数据进行展示,这是两个,以及获取你po图片进行展示,这是三,以及所有的。平台当中所有的销售数据一共是解释三个,也要发起获取的。啊,所以说要发四个请求。那回到咱们现在开发这个项目当中,那当然咱们现在是没有发请求的。咱们只是完成了相应的静态。对吧,比如说咱们要修改pou名称,你一点击OK,咱们什么都没有。对吧,因为咱们也根本没有发请求,咱们只是完成了相应的静态。但是呢,咱们可以先把这件事先完成了,点击取消。那么当你点击取消的时候,要注意你是不是要返回,哎,返回。这个内容是不是要展示这块的数据?
09:03
对不,那有的同学可能说老师,那这个我知道,当你点击取消的时候,你应该回到咱们主页当中啊,你该让咱们的场景这个值为几为为为零。对,不是不是应该为零零应该展示谁展示的是不是就是它。对不对,对吧,你要注意PU是属于当前这个负组件的一个子组件。当点击这个取消按钮的时候,你要注意。这个取消按钮呢,是在子组件当中,那么在子组件当中啊,当你点击取消按钮的时候,你要通知父亲诶,你应该显示场景值为几为零的这个结构。对不,那所以说是他的儿子,你看啊,找到他的儿子。他的儿子取消了,是儿子要给父组件传数据,告诉他,哎,你的场景的那个值应该是一,就说子给父传数据,那一定是需要通过自定义事件。
10:05
那所以说咱们呢,可以给他绑定个单机事件,先把这件事先给它做了,比如说叫做GOSC。去哪个场景呢?对吧,那比如说啊,或者咱们这直接这么写也行,就直接触发自定义事件dollarit。对不,那这个呢,咱们叫做change CE应该为几,应该为零。对,不,相当于你点击这个取消按钮,会触发一个自定义事件,叫做change。对,不那么给负组件传了一个数据是零,那当然回到负组件这。那你需要给这个子组件是绑定咱们的自定义事件。对不对,对吧,那就是艾特谁艾特他叫做she。为什么,那咱们呢,得写一个回调了,那这个咱们叫什么呢?叫做就叫做呃,就叫做change对不。
11:00
那当然咱们没有这个回调,那你需要去写下这个回调,那回到咱们卖的这儿来,把没用的线给它折上。对吧,没有先给它折上,那这块写一下呢,这块呢是一个自定义事件的回调,是哪个自定义事件呢?是是咱们的PU放自定义事件。那么当你一点击的时候,你会给咱们给父亲传入一个场景的值,那咱们呢,先打印一下子,先看一下有没有你万一没有。对不,那咱们呢,看一下子来看这。图书电子书刊电子书走修改,当你点击取消的时候,你看一下父亲能不能拿到这个值,对不。是不是可以,那么副组件那只需要做一件事,就是让咱们的这点SCNE等于SCSCNE对不就是切换场景,哎,切换结构。
12:00
对吧,就是所谓的场景三个场景啊。那这回呢,咱们呢,可以回首的测试一下。对不,哎,图书电子书刊电子书修改,当你点击取消是不是回来了。对吧,啊只汤。但是呢,咱们的业务分析呢,没有完事。接下来咱们要分析的是什么呢?就是你这个PU form这个子组件什么时候该发请求。对不,咱们测试一下,你看这啊,老师给你打开network,你看图书。电子书刊。电子书,OK,老师要先把这块的请求接口的先给他干掉,你看这样啊。当老师点子,呃,选中比如AA这个PU,你看啊,他会发四个请求。对吧,获取相应的数据进行展示,这是没问题的。老师点击取消,你看。当老师再点击这个按钮的时候,你会发现他又发了四个请求。也就是说,每一次要显示po放这个子组键的时候,都会发四个请求。
13:06
对不对?那你说这个请求该写在哪儿呢?那咱们以前写的时候经常在哪写,经常在monkey当中去写。那咱们这回你看一下子在monkey当中发请求行不行。对不,那这个是什么?是不是应该是咱们的子组件的组件挂载完毕的地方叫mount mont mount。对不?那咱们也先不发请求,咱们就写上一句话,叫做发请求。那咱们看一下在mounted当中,在子组件的mounted当中,发那四个请求行不行?对不,那咱们刷新看一下,看下咱们的这个啊,你看这。首先说,当老师一刷新的时候,你就会发现了子组件po form已经发请求。对不对,那为什么呢,你想想啊。
14:00
P form,它是在副组件当中进行使用的,老师呢,把这呢没用的结构呢先给你折上,你看啊。首先说PU form是在副组件当中使用的。对不,我不管你显示还是隐藏或者是隐藏,你已经挂载完毕了,所以说它会立马执行一次。对不,那咱们看一下子,那当老师点击点击谁点击修改po的时候,你会发现。根本没有在执行。对吧,因为咱们应该知道mon的是当组件挂载完毕之后,只会执行几次,只会执行一次。那如果你想让咱们的mon多次执行,那你只能让谁让咱们的po form进行?挂载与卸载的操作,那咱们应该知道,它这里面采用的是V杠受,但只是进行了啥显示与隐藏,它不会再次触发,就是每一次显示隐藏不会再触发。对不,所以说这块要注意,就是咱们的这个po放码。
15:04
写下PU。Form子组件发请求的地方的分析。首先说第一个不能书写在哪?Mon提提monkey的理念,为什么呢?因为咱们刚才看了一下啊,看了一下已经。哎,完成的项目,那么你会发现每一次显示po放。哎,子组件的时候。那么都会发四个请求。对不,而我们为什么不能?放在子组件的mounted里面呢。为什么?哎,因为V杠受它只是指什么?只是控制着控制PU。
16:03
Form子组件的显示与隐藏,对不,那么这个子组件并没有,怎的并没有,呃,卸载。对,不,那只是括弧,只是怎么的,只是显示或者是隐藏。对吧,那么导致导致咱们的mount的monund mount的只能执行几次,只能执行一次。对不?所以说咱们的那四个接口,你不能写在子组件这个mount当中。那这怎么整啊,那你该写在哪里啊?那咱们分析分析。你看你可以怎么搞,你可以这么搞。团长,就是当你每一次点击这个修改P按钮的时候啊,你可以怎么办,你可以让子组件发一次发四次请求。就是你每次点击这个修改PU这个按钮的时候,让让谁让他的子组件发进去。
17:06
对不,那你看现在这块的结构在哪呢?现在的这个结构是在副组件当中,你看嘛,这不这四个按钮吗。咱们现在有有结构的地儿,不就这。对不,哎哎,走,你看现在咱们那四个按钮在哪,是不是在这在黑的八字这。对不对,对吧,也就是说当你每一次点击修改PU按钮的时候,你让子组件咋的,让子组件发请求,一下发四个。但是怎么发呀。怎么操作?你现在是在父组件当中,那么你如何拿到子组件,而且让子组件去调用自己的方法?其实这个操作啊,在前面的时候老师教过你们。怎么整?现在是父组件,那么在父组件当中能不能获取到子组件是可以的。你可以给这个子组件打一个谁ref。
18:02
比如说叫做什么叫做po?对不,那咱们可以在点击修改po的时候,咱们看一下子在这。对,不叫update,不就触发它吗?当你修改某一个PU的时候,你完全是可以获取子组件PU PU form。对吧,PU放。PU放子组件。咱们可以通过ref获取的,你看这点Dollar。Re fs.pu那咱们看一下子能不能获取到相应的子组件。对吧,图书。电子书刊电子书,那咱们点击一下,你看一下能不能获取到,是完全可以。那如果说你能在父组件当中获取到子组件,那对于子组件的数据是可以拿到的。对不对,那当然对于子组件的方法也是能拿到的。
19:03
所以说你可以怎么办,可以这么办。在子组件这里啊,你给他定义一个方法。对不,那这块呢,老师呢,先给它折上,那这块干什么是初始化,哎,初始化咱们的PU form的数据。对不,比如说咱们叫什么叫init po po date。对不,那你这块呢,你就可以写一句话,写什么话叫做哎发请求。那你要注意,那这个呢,你是谁,是子组件的一个方法。那么你在父组件当中已经能拿到子组件了,那当然你就可以拿到子组件的方法。对不,你可以拿到子组件的,这个叫做阴逆的啊,你就可以让它直接调用谁调用阴逆。点init谁呀?是不是init叫PU date这个方法data,那这样当你每一次点击修改po这个按钮的时候,都会触发自主键的这个方法,那每一次你都可以让自主延时发请求。
20:08
所以说咱们的回首呢,还是得测试一下,多测试,你看啊,手机手机通讯。一级手机。那么当老师点击主线程的时候,你看啊,是不是发请求。对不再点是不是也会发。所以说呢,咱们是怎么办的,是在父组件当中获取到子组件,那当然你就可以拿到子组件的方法,而且每一次都可以调用子组件的方法。那当然咱们刚刚看的那个接口,你应该知道,你要就比如说呃,就比如说获取某一个po的信息,你是需要携带那个po的ID的。而咱们现在这个肉是啥肉,就是你选择到的那个某一个PU。那对于子组件发请求的时候,子组件这个方法一定是要拿到当前你选中这个SQ的ID,所以说咱们可以把这个肉啊,你给他传过去。
21:04
那在子组件这,你就可以接收接收你选中这个po的信息。对不,那咱们呢,可以打印一下PU。对吧,那咱们呢,这回呢,去尝试一下吧,可不可以。对吧,刷新看一下。比如说选择手机,手机通讯手机对吧,我现在想修改主线程走是不是完全可。是不是可以拿到你要修改的那个po的ID,是不是就可以发请求了,获取相应的数据。对吧,所以说呢,这个套路呢,在咱们前面的时候,咱们说过,就是在讲组建通信的时候。就是在父组件当中可以获取到子组件,那你可以使用子组件的属性,那当然也可以调用子组件的方法,那也就是说你每一次点击这个按钮的时候,修改po的时候,那让字母键发请求不就可以了吗?啊,所以这个套路一定要学会了,就是咱们当年讲的时候也讲过,那么在。
22:04
副组件当中。那么可以。通过Dollar谁Dollar ref获取子组件,对吧?或者是通过组件的叫做children。对不?这还有点印象吧,等等,是不是都可以获取到组件?所以说这个是对于咱们po form的一个发请求业务的一个分析。
我来说两句