在回调期间，react-native-super-grid刷新网格

Question

我在网格中显示项目，每个项目都被分类。如果我按下类别图像，我想仅筛选所选类别的网格项。

这是我的实现代码。每当我按下某个类别时，我会在pressRow方法中获得this个对象，但this.setState({items: categorizedItems});会返回undefined is not an object(evaluating 'e.forEach') 错误。我在这里缺少什么？

import React, { Component } from 'react';
import {
  Platform,
  StyleSheet,
  Text,
  View,
  Image,
  ScrollView,
  TouchableOpacity,
  PixelRatio
} from 'react-native';
import GridView from 'react-native-super-grid';
import Row from 'react-native-row-component';
import _ from 'lodash';

    export default class MyPage extends Component {
      constructor() {
        super();
        this.state = {
      items: [
        { uri: 'https://...', category: 'bag'},
        { uri: 'https://...', category: 'bag'},
        { uri: 'https://...', category: 'book'},
        { uri: 'https://...', category: 'book'}
      ]
    }
  }

  renderGrid(item){
    return(
      <View style={[styles.itemContainer]}>
        <Image source={{uri: item.uri}} style={item.image}/>
      </View>
    );
  }

  pressRow(categoryName){
    let categorizedItems = this.state.items.slice();

    if (categoryName != 'All') {
      categorizedItems = _.filter(this.state.items, {category: categoryName});
    }
    this.setState({items: categorizedItems});
  }

  render() {
    categories = [
      {displayName: 'Bag', name: 'bag', uri: 'https://...'},
      {displayName: 'Book', name: 'book', uri: 'https://...'}
    ];

     return (
       <Row>
       <View>
       <GridView
         itemDimension={90}
         spacing={0}
         items = {this.state.items}
         style={styles.gridView}
         renderItem={this.renderGrid.bind(this)}
      />
      </View>
      <View style={{flex: 1, flexDirection: 'row', padding: 50}}>
      {
        categories.map((category, i) => {
          return(
            <TouchableOpacity activeOpacity = { .5 } key={i} onPress={()=> this.pressRow(category.name)}>
              <Image source={{uri: category.uri}} style= {styles.categoryImage}/>
              <Text key={i} style={styles.categoryText}>{category.displayName} </Text>
            </TouchableOpacity>
          );
        })
      }</View>
      </Row>
     );
  }
}
const styles = StyleSheet.create({
  gridView: {
    padding: 10,
    flex: 0,
    borderWidth: 1,
    borderColor: '#d6d7da',
  },
  itemContainer: {
    justifyContent: 'flex-end',
    borderWidth: 1,
    borderColor: '#d6d7da',
    padding: 0,
    height: 120,
  },
  image: {
    flex: 1,
    borderColor: '#d6d7da',
    resizeMode: 'contain'
  },
  title: {
    padding: 10,
    justifyContent: 'center',
    alignItems: 'center'
  },
  showroomTitle: {
    fontWeight: 'bold'
  },
  categoryTitle: {
    position: 'absolute',
    color: '#ffffff',
    fontWeight: 'bold',
    paddingLeft: 20,
    paddingRight: 10,
    backgroundColor: '#808080',
  },
  categoryImage: {
    width: 25,
    height: 25,
    borderColor: '#d6d7da',
  },
  categoryText: {
    padding: 10,
    justifyContent: 'center',
    alignItems: 'center'
  },
});