ios - 非 iPhoneX 设备中的错误 - null 不是对象

Question

当我在 iPhone X 模拟器上运行我的应用程序时，它按照设计运行，没有错误。

当我在 iPhone 5S、7 和所有其他非 iPhone X 设备上运行它时，我收到一条错误消息:null is not an object (evaluating '_this.props.filters.map)

这是我的代码的渲染部分:

render() { 
        return( 
          <View>
            <NativeText 
                color='gray' 
                style={{
                    paddingLeft: '3%', 
                    paddingTop: '2%', 
                    paddingBottom: '2%', 
                    borderBottomColor: 'gray',
                    borderBottomWidth: 1, 
                    fontSize: 14
                }}>Saved Filters</NativeText>
            <View
                style={{
                    borderBottomColor: 'gray',
                    borderBottomWidth: 1,
                }}
            />
            <View style={{flexDirection: 'row', flexWrap: 'wrap', backgroundColor: '#f7fafc'}}>
                {
                    this.props.filters !== null ? this.props.filters.map(
                        (v, i) => {
                            return(
                                <View key={i} style={{flexDirection:'row', alignItems:'center', paddingLeft: '2%'}}>
                                    <NativeText
                                        key={i}
                                        onPress={() => this.updateCurrentFilter(i)}
                                        style={{
                                            paddingLeft: 10,
                                            fontWeight: "100",
                                            fontSize: 14
                                        }}
                                    >{v.filter_name} </NativeText>
                                    <View
                                        style={{
                                            alignSelf: 'flex-end' 
                                        }}
                                    >
                                        <Icon 
                                            name={this.props.checkedFilters !== undefined && this.props.checkedFilters[i] === true ? 'toggle-switch' :  'toggle-switch-off-outline'} 
                                            size={29} 
                                            style={{top: '7%'}}
                                            color='black'
                                            onPress={() => this.updateCurrentFilter(i)}
                                        />
                                    </View>
                                </View>
                            ) 
                        }
                    ) : null
                }
            </View>
            <View
                style={{
                    borderBottomColor: 'gray',
                    borderBottomWidth: 1,
                }}
            />
          </View>
        )
    }

这些 props 来自默认状态为 null 的 redux reducer 。

对于非 iPhone X 设备，有什么我应该注意的特定事项吗？

Answer 1

您收到错误，因为 this.props.filters 中有 null 值

试试这个:

        <View style={{flexDirection: 'row', flexWrap: 'wrap', backgroundColor: '#f7fafc'}}>
            {
                this.props.filters  ? 
                    this.props.filters.length > 0 ?
                        this.props.filters.map((v, i) => {
                            return(
                                 </View> // your component here
                         )}) 
                     : null
                 : null
            }
        </View>