APP搜索 怎么创建

import React, { useState } from 'react';
import { View, TextInput, FlatList, Text } from 'react-native';

const AppSearch = ({ data }) => {
  const [searchText, setSearchText] = useState('');
  const [filteredData, setFilteredData] = useState(data);

  const handleSearch = (text) => {
    setSearchText(text);
    const filtered = data.filter(item => item.toLowerCase().includes(text.toLowerCase()));
    setFilteredData(filtered);
  };

  return (
    <View>
      <TextInput
        placeholder="Search..."
        value={searchText}
        onChangeText={handleSearch}
        style={{ height: 40, borderColor: 'gray', borderWidth: 1 }}
      />
      <FlatList
        data={filteredData}
        keyExtractor={(item, index) => index.toString()}
        renderItem={({ item }) => <Text>{item}</Text>}
      />
    </View>
  );
};

export default AppSearch;