无法在React中读取toLowerCase的未定义错误的属性

Question

我正在尝试设置文本过滤器，以在我的react和redux应用中添加搜索功能。 将文本匹配添加到费用的标题中，但此错误正在我的控制台中恢复。

某些可能有用的代码。

费用选择器

const textMatch = expense.title.toLowerCase().includes(text.toLowerCase());

同时接收此错误以及上述错误：

react-dom.development.js:8305 The above error occurred in the <Connect(ExpSummary)> component:

以下是我的expeummary组件的代码：

    export const ExpSummary = ({ expCount, expTtl }) => {
    const expAlert = expCount === 1 ? 'expense' : 'expenses'; // more than 1 exp use expenses

    const formatTtlExp = numeral(expTtl / 100).format('0,0.00');
    return (
        <div className="dash-header">
            <div className="content">
                <h1 className="dash-header__title">You are viewing <span>{expCount}</span> {expAlert}, amounting to: <span>{formatTtlExp}</span></h1>
                <div className="dash-header__createexp">
                    <Link to="/create" className="btn btn--link">Create Expense</Link>
                </div>
            </div>
        </div>
    );

};

const mapStateToProps = (state) => {
    const visExp = selectExps(state.expenses, state.filters);

    return {
        expCount: visExp.length,
        expTtl: selectExpTtl(visExp)
    };
};

export default connect(mapStateToProps)(ExpSummary);

在寻找拼写错误时排除故障，但没有！

更新**

Expense selector snippet
export default (expenses, { text, sortBy, startDate, endDate}) => {
    return expenses.filter((expense) => {
        const createdAtTime = moment(expense.createdAt); // get created at datetime
        const startDateMatch = startDate ? startDate.isSameOrBefore(createdAtTime, 'day') : true; // ternary op - true/false
        const endDateMatch = endDate ? endDate.isSameOrAfter(createdAtTime, 'day') : true; // ternary op - true/false
        const textMatch = expense.title.toLowerCase().includes(text.toLowerCase());

        return startDateMatch && endDateMatch && textMatch;
    }).sort((a,b) => {
        if (sortBy === 'date') {
            return a.createdAt < b.createdAt ? 1 : -1; // ascending or descending sort order
        } else if (sortBy === 'amount') {
            return a.amount < b.amount ? 1 : -1;
        }
    });
};

Answer 1

const textMatch = expense.title.toLowerCase().includes(text.toLowerCase());

错误指出了这一行代码，并显示“无法读取属性”。这意味着未定义expense.title。因此您的对象费用没有标题属性。您应该检查如何定义费用对象。