Javascript 函数返回时的重新渲染器组件

我有一个类函数，它过滤我的道具，然后用它来渲染一个deckswiper。问题是该函数在deckswiper渲染时没有完成，因此它渲染了一个空白的deckswiper。有没有一种方法可以在数据组完成时使其重新加载，或者使函数异步？或者我应该在其他地方过滤这些数据？当我第一次刷新页面时，deckswiper是空的，然后如果我单击我的按钮添加更多数据，它似乎可以工作

import React，{Component}来自'React'；
从'react redux'导入{connect}；
从“本机基础”导入{容器、视图、DeckSwiper、文本、微调器、按钮、图标}；
从“../actions”导入{findDogs，addDog，blacklistDog}；
从“/SwipeDogItem”导入SwipeDogItem；
类SwipeDogSelect扩展组件{
组件willmount（）{
this.props.findDogs（）；
}
应更新组件（下一步）{
if（nextrops.blacklist！==this.props.blacklist）{
返回false；
} 
返回true；
}
狗繁殖（品种）{
if（数组.isArray（繁殖））{
让breedString=''；
for（设i=0；i{
返回黑名单索引（宠物id$t）=-1&&
（selectedbrides>248 | | Object.values（pet.brides.brides）.filter（val=>！selectedbrides.includes（val））。长度<1）&&
（性别==='任一'| |宠物性别。$t===性别）&&
（尺码=='any'| |宠物尺码。$t===size）；
});
}
renderDeckSwiper（）{
console.log（this.props.dogs）；
if（this.props.findingDogs | | typeof this.props.dogs==='string'）{
返回（）；
}else if（this.props.dogs==未定义）{
返回(
没有找到狗。
);   
} 
返回(
（这个._deckSwiper=mr）}
数据源={this.filterDogs（）}
renderItem={dog=>{
返回(
);
}}
renderEmpty={（）=>{
返回（未找到狗。尝试较少的过滤器或刷新）；
}}
onSwipeRight={（狗）=>{this.props.addDog（狗）；}
onswipleft={（dog）=>{this.props.blacklistDog（dog.id.$t）；}
循环={false}
/>
);
}
render（）{
返回(
{this.renderDeckSwiper（）}
{
this.props.blacklistDog（this.\u deckSwiper.\u root.state.selectedItem.id.$t）；
这个。_deckSwiper。_root.swipleft（）；
}}
>
this.props.findDogs（）}
>
{
this.props.addDog（this.\u deckSwiper.\u root.state.selectedItem）；
这个。_deckSwiper。_root.swipleft（）；
console.log（this.\u deckSwiper.\u root）；
}
}
>
);
}
}
常量样式={
按钮样式：{
边框宽度：1，
边框颜色：“rgba（0,0,0,0.2）”，
对齐项目：“居中”，
为内容辩护：“中心”，
宽度：75，
身高：75，
边界半径：100，
玛金托普：100，
},
按钮视图样式：{
flexDirection:“行”，
弹性：1，
位置：“绝对”，
底数：15，
左：15，
右：15，
辩护内容：“间隔空间”，
填充：15
},
按钮样式：{
尺码：45，
}
};
常量mapStateToProps=状态=>{
const{selectedbrides，gender，size}=state.settings；
const{dogs，findingDogs}=state.findDogsReducer；
const{blacklist}=state.dogs；
返回{
狗，
寻找狗，
黑名单，
精选品种，
性别,，
大小
};
};
导出默认连接（mapStateToProps，{findDogs，addDog，blacklistDog}）（SwipedLogSelect）我最终切换到另一个swiper，因为本机base的swiper导致了问题。
renderItem={dog=>{return（）；}}的目的是什么？我相信问题在于您正在即时执行函数dogBreedString。为了将参数传递给函数的引用，必须在高阶函数中进行传递。尝试执行如下操作：breed={（）=>this.dogBreedString（dog.brides.breed）}我添加了整个组件。繁殖不是问题。在我添加过滤之前，它工作得很好@Dupocas我确实尝试了您的修复，但它不起作用。如果您将
this.filterDogs（）
添加到您的console.log，它是否有任何项？我这样做了，它首先返回一个空数组[]，然后返回一个包含对象[{}，{}]的正确过滤数组