已知存在有两个固定写法的API数组(下面)。
其中cat.api里的id值等于post.api里的categories值。需要在前端页面循环显示分类和分类下的文章。第二个循环不知道如何关联写法。请大神们看看
<block wx:key="id" wx:for="{{categoriesList}}"> <view class="list-item"> <view class="content-title" data-item="{{item.name}}" data-id="{{item.id}}" bindtap="redictIndex"> <view class="topic-name"> <text>{{item.name}}</text> </view> </view> <view class="common-list"> <block wx:key="id" wx:for="{{postsList}}"> <image src="{{item.post_medium_image}}" mode="aspectFill" class="cover"></image> <view class="content-title"> <text>{{item.title.rendered}}</text> </view> </block> </view> </view></block> |
需要的前端效果:
文章分类cat.api。其中cat.api里的id值等于post.api里的categories值。
[ { "id": 112, "count": 7, "description": "", "link": "https://", "name": "分类CAT1", "parent": 120, "meta": [], "category_thumbnail_image": "" }, { "id": 113, "count": 0, "description": "", "link": "https://", "name": "分类CAT2", "parent": 120, "meta": [], "category_thumbnail_image": "" }, { "id": 126, "count": 4, "description": "", "link": "https://", "name": "分类CAT3", "parent": 120, "meta": [], "category_thumbnail_image": "", }] |
文章post.api
[ { "id": 1134, "date": "2019-10-08T14:13:41", "date_gmt": "2019-10-08T06:13:41", "type": "post", "link": "", "title": { "rendered": "文章1" }, "excerpt": { "rendered": "DESC1", "protected": false }, "author": 1, "categories": [ 112 ], "post_thumbnail_image": "https://", }, { "id": 1131, "date": "2019-10-08T14:13:41", "date_gmt": "2019-10-08T06:13:41", "type": "post", "link": "", "title": { "rendered": "文章2" }, "excerpt": { "rendered": "DESC2", "protected": false }, "author": 1, "categories": [ 112 ], "post_thumbnail_image": "https://", }, { "id": 1128, "date": "2019-10-08T14:13:41", "date_gmt": "2019-10-08T06:13:41", "type": "post", "link": "", "title": { "rendered": "文章3" }, "excerpt": { "rendered": "DESC3", "protected": false }, "author": 1, "categories": [ 113 ], "post_thumbnail_image": "https://", }, { "id": 1125, "date": "2019-10-08T14:13:41", "date_gmt": "2019-10-08T06:13:41", "type": "post", "link": "", "title": { "rendered": "文章4" }, "excerpt": { "rendered": "DESC4", "protected": false }, "author": 1, "categories": [ 113 ], "post_thumbnail_image": "https://", }, { "id": 1022, "date": "2019-10-08T14:13:41", "date_gmt": "2019-10-08T06:13:41", "type": "post", "link": "", "title": { "rendered": "文章5" }, "excerpt": { "rendered": "DESC5", "protected": false }, "author": 1, "categories": [ 126 ], "post_thumbnail_image": "https://", }, { "id": 1075, "date": "2019-10-08T14:13:41", "date_gmt": "2019-10-08T06:13:41", "type": "post", "link": "", "title": { "rendered": "文章6" }, "excerpt": { "rendered": "DESC6", "protected": false }, "author": 1, "categories": [ 126 ], "post_thumbnail_image": "https://", }] |

<view wx:for='{{categoriesList}}'><view wx:for='{{postsList}}'wx:for-item='item_p'wx:if="{{item.id == item_p.categories}}">{{item_p.id}}</view></view>这样吗?
wx:if判断item1.id=item2.categories
谢谢各位的解答。解决了,代码片段:https://developers.weixin.qq.com/s/RZErN8m77scx
你为什么不先把两个合并成一个,然后一个for不就可以了吗?改变下数据结构不就行了,渲染和逻辑分开
第一重循环中,用wx:for-index保存categories的索引,第二种循环遍历post时,用这个索引来比较cat数组的catid和posd数组的id是否一致,大概如下:
第一重:wx:for="{{categoriesList}}" wx:for-index="cat_idx"第二重:wx:for="{{postList}}"
第二重循环里面判断两个变量相同则显示wx:if("categoriesList[cat_idx].id==postList[index].categories")
写个代码片段:https://developers.weixin.qq.com/miniprogram/dev/devtools/minicode.html 你这个太乱了看不懂。