00:00
哈喽,小伙伴友大家好,我是德玛哈士奇。上个视频呢,我们做了一个这个文章编辑器,对吧?啊就是。嗯,做完文章编辑器呢,我们的文章也可以显示出来,对吧,它存在它里边,图片也是存在了这个云存储里边,那我们就是如何让它展示出来呢。做一个资讯的列表啊,就是那种新闻媒体列表。嗯,三个视频才看到,我们是做到这里了是吧,就是那个文章我给它显示出来了。那这里呢,我给它就是去掉啊。我们这里用了一个卡片啊,用了一个UV的卡片。然后变成这些不让它显示尾部啊,就是这个样子的,可能大家看起来有点丑啊,这个微信小程序里面给给大家看看这个样子啊。现在这个东西都是默认的啊,这个介绍,这个介绍可以当成我们写文章的简介,对吧。然后这个或者从工程里边截取一部分。
01:01
然后这个链接呢。就是这是图片地址,图片链接啊,我们就暂时也是用这个静态的默认的资源哈。那我们这个这个视频要做的就是把它展示成那种列表形式。我看看一下哈,这个多复制几个看什么样的。哦,只留下一个。微小程序。啊,我这里也是把这个这个view的高度也改变了一下,我们再来看一下什么效果。那天滑了对吧,有点滑动了啊,我们这里的点击是没有任何效果的是吧,而且我们这是都是都是静态的。
02:06
呃,这里呢,我先删掉,删掉之后呢。等会我们要写几篇文章对吧,然后让他获取一下这个列表数据哈。怎么获取呢?我们在这里写一个就是。呃,其实我们也可以用那个的那个DB组件哈,简单组件,但是这里我们不用哈,我这里继续写哈,这写一个。配先配啊。呃,还有就是我们还需要获取,我们就是。看一下这个文章分类我们也获取过了是吧,是这个list对吧。List,我们也需也需要通过这个文章分类呢,去获取文章是吧?好,我们这先写get,然后我们打开这个。从这台看一下数据是什么样子的哈。他就是是上个之前有小伙伴在那个评论区留言。
03:03
说要那个做那个搜索,然后还有这个。这个历史啥的,嗯,搜索记录和联想啥的,那这个呢,给大家推荐一个插件啊,就是云端一体搜索模板,这个是D壳前端曾经做的。嗯,可以看到这里边有热词设置,可自定义回收,默认设置热热词什么。啊,对吧,还有这个搜索历史。啊,搜索记录。然后这个搜索发现搜索联想APP输入兼容,嗯,这个就可以啊。大家可以直接拿走下载下载用啊,然后根据这个自己的需求改一改哈,这里我们这个这个讲不讲这个啊,你直接你直接导入这个插件就可哈。然后运行起来,然后那个,然后根据他要求啊,你要创建那些这个数据表啊,或者你直接上传,嗯,那个我们如果以后有时间的话,再给大家讲这个。
04:01
我们可以看到我们这个文章列表啊,啊,可以看到我们这个文章。嗯,这表结构里面呢,嗯,这个有分类ID对吧,有分类ID。那我们可以看一下这个封面ID哈。嗯。分类ID。这个是空的,这这个是之前没有创建的,这个是这个是测试的,测试的,测试的时候随便写的对吧。分那没有选是吧,那我们把它给删掉好。嗯,因为咱们有分类嘛,留他干啥呀。那我可以看我们这个分类呢,它这个,呃,看看我不是啥这个咋读啊,什么ID是是不是里边是有数据的是吧,我们来看一下这个分类,分类这个表哈。啊,就它对应的里边这个这个这个ID的哈。那我们就好办,我们通过那个list已经拿到这个idea了,对吧,然后我们又可以根据这个分类来判断是吧,那好我们来写啊来写首先呢,我先我们先看一下这个点log。
05:06
This,加丽是吧?4.64的。69号。56号啊,应该应该也是也是他啊。就是DD是吧,D和这个name啊name,然后还有就是S1对吧,那我们每次切换的时候,可以看到这个切换的时候啊。我先把其他的给给去掉哈。我看都有哪些哈。就是三,那这三的话就好办了啊,这这个是打印的,我们这个这个文章分类的这个东西啊。然后这个是下标,那我们我们可以看到看可以可以看一下啊,控制台我每次切换的时候啊。
06:01
这东西会变成一要文是一对吧,那说明我们要获取的是色为二的,刚才我们看那个数据啊。那切换的时候,我们要肯定要这个。婚姻获取改的配置对吧,类似这样。Get page page,然后这个传什么呢?传入这个按D加一对吧,D加一,那好我们这边我们这边看一下啊,我们CL这个this.list然后再control一下这个dial。这个and对我们传的。然后同时呢,我们呃,就在这个底下获取一下这个相应的。下边的数据啊,它不是一个数组吗?然后我们写。嗯。那这样的话,我们先看一下啊,其实这个加一是有问题的哈,给大家看一下。好,我点一下要文切换出来了之后,这个要么很明显是是是一对吧,然后瑞。
07:01
我们本月获取是一的。内幕是这个耀文对吧,但是我这里获取的是济南获取的是。高效对吧,说明我们这里这个不应该加一哈。因为我们色度起步都是为零的啊,对吧,好,这是我点下要闻,我获取到这个是要闻。对吧,要文那说明我们获取到了,而我们要拿到的是什么呢?我们要获取文章的一些东西,肯定要获取的是它的这个ID,对吧,相应的ID可以看到了吧,这个ID。我把这钱都给删掉,这都不打印,就打印这个玩意儿好的。我来点一下可以看到获取这个ID了,对吧,每次ID获取ID看看到是吧。然后通过这个ID呢,我们也看我们这个数据表了,我们可以通过ID获取什么呢。获取这个相应所有ID为这个玩意的,比如说这是娱乐对吧,为他的这个文章对吧,那我们就来获取一下啊。嗯。
08:00
呃,其实我我们如果这个unit DB用的多的话是吧,我们可以可以把它直接提出来,提取出来在这里写啊,在这里写在DB什么的,然后这都可以简写,那这里我们我我先不简写,等以后有时间的话,再就是。再写一下。嗯。我们这个是什么收据表呢?我们这个是。这个媒体的。新闻咨询列表的对吧,这。点不玩什么呢,玩这个。呃,这个这个他是吧,不要他。首先是个是个对象的类型对吧。因为这里复制是有问题的,所以我们改一下对吧,然后我们就可以把这个拿过来对吧。
09:00
是他的,然后我们获取一下。好,那这里我们来,嗯,来试一下啊,我们填要闻。啊,不好意思。然后我这里还要打印一下是吧,打印看不出来了。考个省,这个其实可不用不用不用考这个省,因为我一下下来了,这就写个is。这个写个万C,我不喜欢写字啊,我写字也一样啊。要文好看到我们获取到了,获取到什么呢?呃。是吧,他这个告诉他告诉我们这个是零。啊,因为我们停了药丸之后,说明药闻里边是没有的,因为我们是娱乐的是吧。这时候我们的点评娱乐呢?呃,我们可以看到这个是有数据的是吧,是有一个数据的看到了吧。那很明显我们要的是这个。
10:01
叫丽对吧,这个是他是吧,那它就是我们需要的数据。那我们呃,肯定要再写一个啊,在这里在这里再写一个数据。哎呀,点错了,不好意思。再加一个符号,我们写什么,写配置吧。一个数组对吧。那这里就要写啊,类似点配对吧,类似点它。好,那就完了,完了,还有就是我们这个。安的时候,我们也可以写一个点get page,我们的这个从零开始的是吧。不,我零开始的。啊,告诉我们LIST2LIST。
11:08
哪里出问题了吗?那2.14肯定是错误的,这是一行是吧。让我看一下他错误啊。那我刚才排查了一下这个,呃,我们写的是没有问题的啊,只不过我们这个东西啊,写在这个里面哈,而且在这个get里,因为我们是通过get获取这个。这个。分类的,然后我们才能获取这个文章是吧,好,我们这。
12:02
获取获取到了是吧,我这个点要文可以切换。可以在这里看到我们的网络请求啊,你点搞笑这里可以看到这个网络请求响应,对吧,也是没有的,那我们点娱乐的时候,娱乐里边是有数据的。看到了是吧。那我们这个数据拿到之后,我们就要给他就是嵌入数据,对吧,我们就把这个这个看就是又看了哈。写成为法。去前面吧。我们我们我们是什么呢?27M和这个案例对吧。嗯。因为什么呢?跟这个配G4吧。那个标题的话就是我们可以看这个数据啊。T就是K头对吧,就是T这头就比较定是STM点推头,然后那个。
13:08
这个我们副标题呢,我们,呃副标题,我看他之前副标题是啥,这个日期是吧,这个日期的话,我看一下我们这边有没有日期啊。Last。那么发data。对,Publish data我们也可以用啊publish data。我们可以这里这里先写哈RTM点。我看看这是啥塔,我给它复制一下哈。Data啊,还有什么,还有还有这个什么,这图图头像是吧,就是用户头像就这个啊,我们可以不写啊这个。他文章里边这个是没有在的,我们也不想写,当然我们也可以写,先默认为这个T啊。啊,有些事也可以的。
14:03
IM的A,然后这个这就叫这个是这个摘对吧。想要什么呢?主要是这个,应该是这个,我们当时写的就是他哈。At。Ale。这个subtle。他告诉我们这个title是有问题的啊。这个。啊,我们先不管啊,啊,这个东西东西显示出来了,只不过这哈士奇这个地方过短哈,过短过短的话就是。它这个图片不定头啊,这它这个默认格式里边这卡的格式啊,那我们都会给它可以给它变一下啊,我们现在要处理的是什么呢?就是把这个东西给变一下是吧,这个这个幺二什么什么这个变成什么,变成我们的日期哈,你可以看到GS里面这u u view里面有有一个。
15:08
日期时间格式化哈,看看这个时间格式化啊,我们可以我们可以直接拿来用的啊。看到这个时间。可是时间已经。怎么加载完成?啊,时间已经这个已经完事了是吧,然后这个标题是我是在把哈士奇,然后这个内容是哈士奇是吧,然后明显这个图片有点就是这样左了,我们可以就是就是看看。不知道能不能用,不能用我们再换别的形式对吧。是没有用的啊。没有用的话,我们就让内容哈。
16:02
然后内容给他挺过去,我们可以搞一些那个空格符啊。那我去搞一下啊。哈喽小伙伴,刚才我也那个微小程序,呃,那个也也是出了点问题啊,微小程序就是啊,他不他不允许这个微包的这个信号签到的时候出现相同的那个,比如说刚才那个就是IM。嗯,这底下是ims的这个I就不可以,但是这个Q小程序序不可以的啊,我们改了一下,改成这个现在就可以了,就就是正常了是吧,是这个样子的。然后这个日期呢,我给他,呃。改成正常日期。我们看一下这个正常日期啊,是日期也已经出来了是吧,这个是用VIVO的一个S啊。你看那个有的这个time式time格式化哈,这边有很多的。你好,我们继续。啊,这个。
17:01
哎,我们用的是酷白障碍符啊,在这个里面写了一下,把这个摘要啊,给它填充了一下,如果小于20个字符的话,再填充,这样它就会向右啊。集满对吧,把它挤满啊,我们这个列表做完之后呢,啊,我们这里的啊。头盔也过期了。这个。网络慢哈,我这个图片获取的有点慢,呃,我回回头会加一个那个胡家屏啊,加个胡家屏。啊,这里我们点那个发表文章啊。然后我们再发表一个。再发表一个,还是他。
18:01
然后我们下一步。加油。牛。然后我们还是选择这个娱乐。然后发布开放。然后这个不上传提交。运动成功,我们再来看一下这边。这个我们还要加一个那个下拉刷新啊,不然这边它不能及时刷新对吧?呃,不能及时刷新肯定肯定是不行的啊,那我们就可以。加个加个刷新啊。三个。这个配在里面。然后我们可以给它开启下下刷新啊。首页对吧。我再看看那个图。
19:00
刷新几个。可以的呀。感觉是可以下上星的啊。可以下创新,那可以下刷新的话,这个H5可能有点问题的啊。我不用担心这个,呃,小小程序你看它是可以正常的,那就没关系啊,那么这个时候呢,我们要加一个下传性的监听,对吧?呃,这个时候我们要找到这个有啊。有没有?有用APP啊,APPAPI啊,抱歉抱歉用apppi,这有一个找一下啊。交互的话在这个。界面界面里边有一个这个下载刷新啊。这个是on refresh啊就是。监听一下啊,它是和这个是同等级的啊,我们就来写一下啊。
20:02
在哪里写呢?在这个。这写on什么on这个。On put是吧,On put down refresh,它和这个on是同等级的,下刷新的时候肯定要出发这个get对吧?嗯,然后这个肯定要在这get page里面。我们给他这个停止一下这个玩意儿啊,就是stop stop啊stop。啊,不是点,而是unit stop。找我什么的,找我破脏对吧。不当非停止下专心啊,下结束嘛啊,这个时候其实安的时候,安的时候其实我们可以也可以改掉啊,安的时候我们让它变成了一个它的它。是。给大家到时候可以大家看一下效果啊。
21:01
你看啊啊啊,这个把我把这个自带的这个手loing,我们自己写的手loing和ing给去掉啊。他就他每次出来的时候,他他就会。当我们每次就是加入的载入的时候。它就会这个出现这个下刷新的样式,然后开始刷新,刷新完之后啊,就会出现这个样子是吧。那我们这个下船性也下线也搞定了啊,下也搞定了。然后我们写什么呢?点击这个东西,我们肯定要进去是吧,我们要肯定要进入一个页面,我们看他的这个文章的内容,对吧,那我们也可以写啊。呃,有一种方法是啥呢?有一种快速的方法就是。我们可以在这新建页面哈,这里边儿是有一个那个。新闻详情的,看到没有,这里边是有新闻详情的啊。呃,我们可以看到这个特价市场哈。
22:01
好慢呀。是云端一体这个新闻详情模模模板啊,它是这个样子的,看到了吧。他这里呢,其实就是一个就也是解析了一下副文本,你知道吧。嗯,他用的open DB。嗯。啊,我们可以用下用用下来试试看啊,来节省一下我们的时间,我这里先试一下啊这个文章吧,文章我们就写一个。就写个配。B。Look look吧look,试试看这个新闻详情对吧?新闻详情我们创建一下这个新闻详情。天过也有。然后这系有详情是look对吧,那我们可以给它加一个点击事件啊。
23:02
啊,去看一下这个。还有就是我们先点下那个logo看一下啊。看到那个我们需要传传参数对吧,我们需要传ID看到了吧,和title看到了吧。我们需要传ID和title。就是我们录路由,路由特长的时候给传哈,嗯,我们这样来来设一下哈,我们给这个。看的。三个点击事件。TIK等于什么呢?等于这个look,我们也写成look,就写成look,它需要传的是ITMS,对吧,就是ITM,就是我们这个文章的,呃,我们宣传标题和这个ID啊,我们就在这里写啊。我们喜欢,我喜欢之间,对吧。我时间干什么呢?我们要路由跳转对吧,出出什么出这个URL。那肯定是look是吧,Look我们需要写的参数哈。
24:02
到时候我们可以呃,改一下,我们改成那个腿部上面那个符号啊。传说参数的ID对吧,ID等于什么呢?等于这个IM,我们在这写IM对吧,IM。ATM点。那个ID,然后还有什么呢?还有就是title t t对吧,T等于什么呢。是 Rt.T走好,我们就这样写进来,那我们看下效果。停一下,他点来之后呢,他发现未找到这个I detailed STEM。啊,这个是详情的哈。我觉得他可能这个真的已经有了。还是没有啊,详情是吧,那我创建一个创建一个吧。找到我们云数云云数据库啊,看那个新闻里边。
25:01
诶。有相亲吗?稍等一下,我看一下里边还真没有详情哈。他这边也没有啊,看那个。Models。那我再给他重新创建一个。新闻新闻详情,那就写个text tts。阿木,重建一下。看看需要导入。嗯,确认覆盖一下吧。看这里,这里就多了一个,多了一个这个这个详情啊,看看另外这个detail这个数据表。
26:06
嗯,但是这个怎么感觉很像那个呢。像很很像我们这个。很像那个阿迪对吧,很像那个。那这里我先不管,我来我来试一下啊,试一下总感觉哪里有问题吧,怪怪的,用用用它这个玩意的话。那个奖金。那这个我们存储的时候啊,就有点问题啊,存储还要还还要文章里面存一份是吧。嗯。看看这个文,看看这个结构啊。
27:13
先上传一下,我给他上传一下。刷新一下看看这个。刷新一下看看。这个数据表应该是有的啦。Detail。他那里边是空的啊。看他表结构啊。搜索图地址。这不是和我们那个很像吗?这和这个这个很像的,我试一下哈。我试一下,如果就是写这个东西的话。
28:03
我们之前那个E里边,E里边不是有这个上传文章吗?呃,我们看上传这个上传文章。Rid of sub。嗯。我试一下啊,我们这里直接就是通过他上传文章试一下。不知道,不知道这个两个表是不是连连连起来的,联系起来的。那我们下一步怎么写一个?开放你发布娱乐,然后我们提交一下。
29:10
STEM。I。这里应该是新增成功了,我这里看一下这个数据表啊。没有记录,那我们上传的还是这个。按照底多少,那我们就把这个lo里边这个给改一下,改下这个数据来源啊呃,他目前这个ID不是固定的吗,我们。这个。他他来的是detail detail是吧,我把它改成给改成把它改成S啊,那这样的话我们再试一下。
30:02
用那个啊。啊,我们这里就已经获取成功了是吧,然后还有就是。注意啊,要改的就是这更新于什么什么什么,这个我们也要改啊,我我我再看一下这个details这个结构,我们可以把这两个表给整合一下,对吧。Detail。排版显示模式,还有这个几个。是我指定。啊,我拿假精什么的,然后看一下这个。躺好。就就是像这个他俩是一样的哈,而且他俩是一样的哈。评论数量,开放评论。他这个他俩不他俩是一样的啊感觉吧。都不用这个了,我们还用这个,原先我们写的这个,你看可以看看到是一样的,这个时候我们还要改动一些东西哈。把那个look look给移过来啊,把这个其他的给右侧标签给删掉。
31:05
把这个给我们用一下,这个还是有没有这个日期格式化啊,日期格式化。更用于什么什么?Twenty five。把这个给他加个右括号。这个日期也给他更新过了是吧。这个哈士奇第一个应该是啥呢?我觉得可能是一个。图片一,Can also the AR。作者,信心啊。更新于。呃,底下是cover cover我们可以改成这个。七二。这条点,因为像这个搜勒图啊,缩勒图这个文章摘要。欧莱亚,我莱亚就是哈士奇对吧。这个副文本解析。来,学生应该看看。
32:05
我们那个数据呢。这个说句。点VAR。啊,应该是我们这个图啊,我看一下这个,呃,手机表这个链链接啊T啊。卑微天下就是菜啊。不过我们我漏了漏了一个东西啊,就是我们这里好像是没有查的啊。我们换这个字段了啊,所以我们把这个非给给解一下啊,放通塔。那这就有了是吧,就是我们那个图片不是有点大啊。然后这是我们的文章啊,那就这些了,如果你觉得不好看的话,其实你可以把这个隐藏掉下,一般我们是不看这个东西的,是吧。封面封面图我们不一定看啊。
33:03
所以这个东西我们可以就是给他隐藏一下。这个文章摘要,文章摘要我们也给它隐藏一下。就是把那个斑点给去掉。这时候就是我们的文章了,文章了是吧,看这是我的文章,就我们之前写的文章,然后我们再看其他的。还是这个文章,就说一点东西是吧。他他就是个牛上面的。这个文章详情我们也做好了啊,就是有的地方出点问题啊,就是它这个。一体新的模板用的那个数据表是呃,哈。加了个,但是我们我们还是用,我们发现这两个表基本上是一样的,所以我们改了改成就改成那个,就改成个用个。
34:02
加这个的哈,那这样我们就实现了这个东西是吧是吧。然后底下我们要做什么呢?下个视频我们就要做这个。关注内容啊,可能要做这个关注内容,然后还有这个评论内容哈。那这个视频我们先到这里吧。
我来说两句