reactjs - 从映射中排除项目
问题描述
我想从映射中明确排除 imgvid 并将其传递给 PostContainer 组件。它会导致重新渲染组件。我希望 imgvid 从 PostList 传递到 PostContainer。但是如果没有这种双重映射(在 postContainer 和 postList 中),我无法正确获取我的数据.jsx 页面。但是这种双重映射会导致 .jsx 页面重新呈现,并导致我在首页中的内容加倍。
<React.Fragment>
<div style={{ marginTop: "10px" }}>
{posts.map(item => (
<PostContainer
isStylefeed={isStylefeed}
likeAccess={likeAccess}
commentAccess={commentAccess}
wowAccess={wowAccess}
yayAccess={yayAccess}
post={item}
imgvid={imgvid}
key={item[ID]}
loadPosts={loadPosts}
currentCommunity={currentCommunity}
currentCommunityID={currentCommunityID}
handlePosts={handlePosts}
getOutfits={getOutfits}
isMember={isMember}
/>
))}
</div>
</React.Fragment>
//PostContainer.jsx
return (
<React.Fragment>
<div>
{imgvid
&& imgvid.map(item => (
<Posts
likeAccess={likeAccess}
commentAccess={commentAccess}
wowAccess={wowAccess}
isStylefeed={isStylefeed}
yayAccess={yayAccess}
handleRedirectOutfitPage={this.handleRedirectOutfitPage}
currentCommunity={currentCommunity}
toggleFlagModal={this.toggleFlagModal}
handleFlaggedPostReasonChange={this.handleFlaggedPostReasonChange}
deletePost={this.deletePost}
handledeleteComment={this.handledeleteComment}
getCurrentProfile={this.getCurrentProfile}
onReadOnlyProfile={this.onReadOnlyProfile}
updatePost={this.updatePost}
handleUpdatePost={this.handleUpdatePost}
toggleUpdate={this.toggleUpdate}
toggleOptions={this.toggleOptions}
handleFlagPost={this.handleFlagPost}
flagModal={flagModal}
post={post}
likesProfile={likesProfile}
followersProfile={followersProfile}
outfits={outfits}
readOnlyProfileModal={readOnlyProfileModal}
modalUpdate={modalUpdate}
postText={text}
postOptions={postOptions}
getAllCommentsByPostId={this.getAllCommentsByPostId}
currentCommunityID={currentCommunityID}
outfitChanged={outfitChanged}
getLatestPost={this.getLatestPost}
toggleMessageModal={this.toggleMessageModal}
messageModal={messageModal}
refData={refData}
showflagModal={showflagModal}
checkFlaggedOrNot={this.checkFlaggedOrNot}
flagged={flagged}
isMember={isMember}
imgvid={item}
email={email}
/>
))}
</div>
</React.Fragment>
);
解决方案
推荐阅读
- python - 如何将列表元素插入 URL
- java - Java XML - 您可以直接跳到深度参考还是必须遍历?
- python - 如何在python中打印变量值而不是内存分配
- python - 403 请求在容器内访问 GCP 上的 Secret 时出现身份验证不足问题
- flutter - 通知的本地化不起作用
- pytest - 处理 Python 覆盖中的 No source for code 错误
- node.js - 什么情况下 onRenderBody 不运行?
- android - Android项目找不到maven本地项目
- python - 根据其他列的条件获取列的值列表
- javascript - 在 for 循环中添加 onClick 事件