为什么数组可以返回空？

嗨，我是新来的人，我正在尝试使用onSelect返回与该名称关联的项目数组。我正在使用点过滤器方法来过滤数组，以便仅显示具有与所选名称相同的键的项。但是我的数组返回空。

class HorizantScroller extends React.Component {

  state = {
    selected: 'Brands',
    statelist: [
  {name: "Brands",
    items: ["1", "2", "3"]
  },
  {name: "Films",
    items: ["f1", "f2", "f3"]
  },
  {name: "Holiday Destination",
    items: ["f1", "f2", "f3"]
  }
]

  };



  onSelect = key => {
    this.setState({ selected: key });
    const myList = this.state.statelist;
    const myItemDetails = myList.filter(items=>items.key === key);
    console.log(myItemDetails)

  }


  render() {
    const { selected } = this.state;
    // Create menu from items
    const menu = Menu(this.state.statelist, selected);
    const {statelist} = this.state;


    return (
      <div className="HorizantScroller">
        <ScrollMenu
          data={menu}
          arrowLeft={ArrowLeft}
          arrowRight={ArrowRight}
          selected={selected}
          onSelect={this.onSelect}
        />

      <Items Items={Items[selected]}/>

      </div>

    );
  }
}

export default HorizantScroller;