00:00
好,那下面写完了选一个。是不是写组件呢,啊写组件,那这里面呢,我们一共有两个组件需要去写。一个是老板的。那么呢,还有一个什么,嗯,大神呐。是不是两个组件了,而这两个组件我们前面说过,我们要根据他们,因为他们都很类似,对吧,就是用来显示用户列表的。那我们先把这个抽取的先给它搞出来,对不对,来什么意思,大家看到完,此时我去在这里面建一个文件夹。叫什么呢?User?你这两个单词嘛,好,接着再去写一个优干的D码,写X。
01:04
好,这一个给他,这是一个一个一般的UI组件,能不能它用来干嘛的。说一下显示指定用户啊列表这UI组件。对吗?也是你传给我什么样的用户列表,那我就选什么用户呢。好,那说明我当前这个组件要干嘛呀。是不是肯定要接收一个user list?这个能不能懂啊,说明我这里面肯定会有一个什么static prop types,等于一个对象接触的名字就叫什么,就这历史可以吧。
02:01
哎,我这个好像没写是吧,写什么。这个大这个小写没问题吧,没问题,好,接着需要去引入proper from proper。那也就是说我这里点什么类型。数组类型嘛,对吧,接着一直require,那下面我是不是要将它们显示出来。真的吗?叫他们写出来好了。那这个呢,也需要去写,我先把那个我这里面也专门啊,为了为了简单点啊,因为那个安D的组件写,其实写的很多了,我就不再去一点一点的去写那些东西了啊这个呢,大家下来就自己写一写。
03:00
我把静态组件先拉过来,我们再改造。啊,在这里面呢,我们先根据这个写法呢,去引入啊一些东西是吧,引入一些UI组件库来d mobile。这个是什么来着,两翼留白是两边有有有一个一段空格是吧?好接着是什么上下留白是不是啊,现在有一个效果叫什么看。是卡片式的效果,就是一个框有一个立体的效果啊,走起来那个效果看起来还挺舒服的,嗯,大家看一下我们这个就是一个卡片式的效果。能看到吧,也就这就是一个卡片。啊。而cut里面会有什么呢?Hand和什么玻璃?Hand玻璃在哪个里面呢?啊,就在这个cut里面啊。
04:05
Hand啊,等于的点。Hand,能看到吧。还有一个什么玻璃,等于。有吗?是不是有啊啊,也就是说什么意思,这一个是头部看到吗?中间有一个分割线下面就是谁。玻璃。这很明确啊,能看到吧,这样看起来效果还可以。好。但是得说一个事啊,说一个事,我们这一个是不是要好一些。真的不,现在相当于显示一个嘛,这不对,我们要根据我的这个数组是不是去产生多个,所以这样我先把那个速度先取出来吧,好吧。
05:02
先出这个等于点。好,那也就是说在这个里面需要干嘛去。写他呀,是吧,来,接着use。又忘了卖呀。对吧,好,那接着是U着每一个是吧,线头,哎,这个结构比较复杂,写个小光。把它里面的东西都给了是吧。搞过来。能看到吧,好,这一个需要有一个什么K。等于U着点下划线ID,前面说过这个K,如果你当前编译这个元素,它有标识,最好用它的标识,能不看到它明显有自己的标识嘛,下划线ID。
06:05
能看懂吧,下面这一个我要显示的这是左侧的一个图片,一个头像,这个头像这个名字从哪来呢?叫user。能看到吧,能看到啊,这一个,这是右边的一个文本。啊,是个动态值是吧,显示的是我当前用户的用户名。啊,User大家看这个这不用户名吗。有没有看到下面是它的玻璃里面的是不是一些信息,好,这个玻璃面信息,我这里面给了玻璃面。用了这么几个div。来职位肯定有是吧,肯定有A一个打考机user post。
07:07
能看到吧,好,接着往下悠着点公式啊看是吧,好得说一说下面的两个,一个月薪,一个描述,哎,这个公式好像没可能有可能没有是不是。最好不能这么整,应该这两个可能有可能没有对不对,那这咋办呢。啊,这个就其实刚才这样是咱整个。是吧,啊,你可以在整体来判断,也可以在内部来判断,都可以啊,都没有问题,我在外部判断也是可以的,比如说我这里面写个大括号。悠着点。哎,我们是不是可以就就就这样吧,这个比较比较直接啊,我们跟用户类型的判断不太好,可能他没有指定的对吧,好有着点看看有值吗,对不对,有值。
08:08
显示这个div可以吧,没有值,那再来一个。对吧,只是我们现在要改为什么呢?月薪,月薪用什么属性。对吧,这个去掉,这个干掉。是吧,下面一个是它的什么描述,User点音符。没问题吧?这个应该是可以弄的啊。好,那这样的话,我们的这一个。主件就写好了。吓到他以后,后面的就好办了,非常好办。那也就是说,譬如说我们的这个老板。
09:03
对吧,他需要去使用谁呀。Import use,大写的啊,List from,点点斜杠,再点点斜杠,Component,下面呢就下面呢就anyway吧,好。很简单直接干嘛呢,写它对吧,但是需要给他传一个什么。Use list的属性对吧?那我是不是需要有一个user list,而user list从哪儿来呢?我的state里面有没有用?来,刚才看一下有一部好像没做。我们写了这个user以后,我们这里面有注册商吗?没有,说白了我们要给他什么添加进去,那这样我们的整个结构就成为了这样的结构。
10:14
对吗?真懂吧,那我们现在。要去读很简单的写什么use的冒号state.use,而我这里面也很简单。那不很简单的事吗?z.pro点。对吧,但是我们的初始值是个空数组。对吧,我们得想办法,是不是从后台获取这一个U历史的数组啊。真的吧,也就说白了,我们要触发那个异步action调用吧。
11:01
我们有触发吗?没有,现在根本就没有,我们只是自定义了。对吧,那我。首先要触发,就要在这里面干嘛呢,引入对吧?啊引入的方法非常简单,点点斜杠,点点斜杠re下面的actions。对吧,接下来再在下面写进来。好。那下面我是不是要想办法在某一个时刻来调它呀?那请问我什么时候调啊,说白了就是我什么时候去发呃这个请求。我们是不是希望一上来就能够显示啊,我们是不是相当于希望说初始化能显示啊。初始化要写这个东西,我们需要在哪块请求,我们大家说过了,这种事情咱发这个请求永远基本上一个位置。
12:09
其实都不用去去想太多,直接把它写出来就拉倒。就要在里面啊。你看我们写了这么久,不都在这写的吗?对吧,OK,无非有两种情况,第一个看你是要初始化显示,还是要说点一个点一个按钮啊,或者做个什么操作才显示。如果你是要初始化显示,必然写在这个里面。如果你是点按钮显示,那你可以在回调函数里面去事件回调函数里面去发行。就这两种情况。来,很简单了,this.props点什么呢?Get就说。
13:08
需要传什么东西吗?穿什么?我现在需要显示的是什么列表啊?那就。能理解吧?好,那这个写好以后,那另外一个。看见A,看见C。把这个改改。另外一个我们要去写啊,大神的这个主界面。好把这个改改,这是大神的主界面是吧,那大神主界面的这个路由组件的名字叫什么,就叫大神。
14:00
好,来,把它写上大神。接着啊,我们在这里面要获取的用户列表是什么类型的。什么老板呗。对吧,其他的通通都一样。有没有看到这,你要想想啊,要要做一个想象,如果我没有抽取这一个,如果我没有抽取,那我相当于是不是要把这个user list写两遍。听到吧,啊,这样就要做一个抽取的操作。好,那到此为止了,我们就把这个写是写完了,下一步就要我们来测一下,相当于我们写了这么久相关东西,前台写了这么多,我们下一步就是要去测试一下,看它能不能显示,能不能显示。好,看看是有什么样的问题啊,有什么问题啊,说哪个是叫user-list啊,这一个路径是不是有问题啊,来打开我们的那个client啊,User list我们不叫S,叫什么image。
15:27
好来,现在我们去干嘛呢?登录一下呗。大神一。可以吧,123。啊。来,走你。是不是出来了。可以吧,啊,初试出来了,但是你发现有两个问题,哪两个问题有一个问题比较严重,有一问题诶还过得去啊,严重的问题是下面这个有部分看不见。
16:03
为什么看不见呢?因为我这个固定相当于否在上面了,给它盖住了,实际上有对吧,还有一个什么问题呢?还有一个就是这个头部我不想动它,但是它动了。要不你看我们现在的。懂不懂不懂,接着这个信息没有,是我那随便添加数据啊,有的信息没有,这个是不是完全能看得见啊哎。好,至少我们已经做的差不多了啊,对吧,下我们再去给他修改啊。
我来说两句