TypeScript环境下TextInput无法过滤FlatList项报item.title不存在于never类型错误

算力阿峰

2026-9-29

报错及功能异常根因

两个问题是关联的，根因有两个：

TypeScript类型推断错误：useState初始化传入空数组时，TS会默认推断数组类型为never[]，因此会报数组元素不存在对应属性的错误
过滤字段使用错误：你调用的用户接口返回数据不存在title字段，列表实际渲染的是name字段，过滤时用不存在的字段会导致永远匹配不到结果，因此输入内容后列表为空

修复方案

1. 解决TS类型报错

首先定义接口返回的用户数据类型，给useState指定泛型，避免默认推断为never类型：

// 可根据接口实际返回字段补全类型定义
interface User {
  id: number;
  name: string;
}

const ManageCustomersScreen =(props: ManageCustomersScreen) =>{
  // 给state指定泛型
  const [filteredData, setFilteredData] = useState<User[]>([]);
  const [masterData, setMasterData] = useState<User[]>([]);
  // 其余代码不变
}

2. 修复过滤逻辑，解决列表消失问题

把searchFilter函数中使用的不存在的title字段，替换为实际存在的name字段即可：

const searchFilter =(text: string) => {
  if(text){
    const newData = masterData.filter((item) => {
      // 替换为实际渲染的name字段
      const itemData = item.name ? item.name.toUpperCase() : '';
      const textData = text.toUpperCase();
      return itemData.includes(textData);
    });
    setFilteredData(newData);
    setSearch(text);
  } else {
    setFilteredData(masterData);
    setSearch(text);
  }
}