一些项目正在使用recyclerlistview

Question

我在我的React Native应用程序中使用RecyclerListView组件。我要渲染的列表是一堵墙，其中包含三种不同类型的项目。其中的一种有时会被裁剪掉，而我尝试了各种修复方法。

所有项目都有指定的宽度和高度（高度取决于每种情况），这就是为什么我们使用forceNonDeterministicRendering道具的原因，组件看起来像这样：

<RecyclerListView
            style={{flex: 1, backgroundColor: '#EEEEEE'}}
            refreshControl={
                <RefreshControl
                    refreshing={this.state.isRefreshing}
                    onRefresh={this._onRefresh}
                />
            }
            onEndReached={this.handleListEnd}
            renderAheadOffset={6000}
            extraData={this.state}
            forceNonDeterministicRendering
            canChangeSize={true}
            initialOffset={12}
            dataProvider={this.state.dataProvider}
            layoutProvider={this._layoutProvider}
            scrollViewProps={{
                viewabilityConfig: this.viewabilityConfig
            }}
            rowRenderer={this.rowRenderer}
            onEndReachedThreshold={0.5}
            onVisibleIndexesChanged={this._trackerView}
            renderFooter={this.renderFooter}
        />

rowRenderer看起来像这样：

rowRenderer = (type, data) => {

    if (data.ads) {
        return (
            <View
                onLayout={this._onLayout}
                style={{flex: 1}}>
                <CardAdvertisement from={'timeline'}/>
                <CardWall from={'timeline'} data={data}/>
            </View>
        );
    } else if (data.suggestion) {
        return (
            <View
                onLayout={this._onLayout}
                style={{flex: 1}}>
                <SuggestionsSlider/>
                <CardWall from={'timeline'} data={data}/>
            </View>
        );
    } else {
        return (
            <View
                onLayout={this._onLayout}
                style={{flex: 1}}>
                <CardWall from={'timeline'} data={data}/>
            </View>
        );
    }

};

这是外观的样子：

这是外观（有时）：

这是元素裁剪的另一个示例