特色图片:在列表中显示特色图片

0
视频
0
完成
0%
进度
0
分钟
0
完成
0%
进度

打开首页的视图文件 .. 在这里我们把内容的特色图片添加进来 .. 先在列表项目的包装上添加一个 media-box-appmsg 这个类 ..

然后在主体文字内容的包装上,再添加一个 media-box__bd_in-appmsg .. 再这个包装的上面 ..

再添加一个 view .. 上面加上 media-box__hd ,hd 表示 header .. 再添加一个 media-box__hd_in-appmsg

包装的里面是个图像组件 .. 一个 imgage ,上面加上 media-box__thumb

在 src 属性里面设置一下图像的地址 .. 这里就是 item 下面的 _embedded 方括号 .. 引号 .. wp:featuredmedia .. 第一个项目 .. 访问一下 media_details ,sizes ,尺寸是 thumbnail ,得到它的 source_url ..

保存一下 ..

现在列表内容的项目里面就会包含一个特色图片的缩略图 ...

再打开响应回来的列表内容里面的一个项目 ..

如果在内容里面设置了特色图片 .. 它的 featured_media 属性就会包含这个特色图片的 id 号 .. 我们可以再去判断一下 ..

回到视图文件 .. 在这个图片的包装上面,用一个 wx:if .. 判断一下 item 下面的 featured_media ..

意思就是,如果项目里面的 featured_media 有值,才会显示这个图片内容 ..

特色图片:在列表中显示特色图片《 微信小程序:内容列表 #1 》

统计

15260
分钟
0
你学会了
0%
完成

社会化网络

关于

微信订阅号

扫描微信二维码关注宁皓网,每天进步一点