反应动态搜索/过滤器返回未定义

Question

我正在尝试创建可以按标题或日期排序的动态搜索。现在，我的代码集中在标题上，一旦我进行了工作，我将对其进行复制以使日期也起作用。但是，现在，我的过滤器方法不起作用，而且我不知道如何在不破坏地图功能的情况下对其进行修复。

我当前收到“无法读取未定义的属性'toLowerCase'” 。它指的是newsItem.title，但不确定如何解决。

import React, { Component } from 'react';
import labNewsJson from '../json/labNews.json';
import '../styles/News.css';
var moment = require('moment');

const newsList = labNewsJson['news'];

class News extends Component {
    constructor() {
        super();
        this.state = {
            search: ''
        };
    }

updateSearch(event) {
    this.setState({ search: event.target.value }) 
}
render() {
    // let filteredNews = this.props.newsList;
            newsList.sort(function(a, b) {
                var dateA = new Date(a.date), dateB = new Date(b.date);
                return dateB - dateA;
            });

            let filteredNews = newsList.filter((newsItem) => {
                return newsItem.title.toLowerCase().includes(this.state.search.toLowerCase())
                }
            );
            const news = filteredNews.map((newsItem, index) => {
                return <div className='newsContainer' key={index}><h3>{newsItem.title}</h3><p><strong>{newsItem.description}</strong><br></br>{moment(newsItem.date).format("LL")}</p></div>
            });


    return (

            <div className='container'>
                <div className='pageTitle'><h1>Lab News</h1></div>

                 <div>{news}</div>
            <input type="text" value={this.state.search} onChange={this.updateSearch.bind(this)} />

            </div>
        );
 }
}

export default News;