React native 从另一个组件触发onPress功能

我想从导航栏中的搜索图标触发onPress功能。 这是搜索组件：

function SearchIcon(props) {
  const theme = useSelector(state => state.themer.theme);
  return (
    <Icon.Button
      name="search"
      size={22}
      color={theme.icons}
      backgroundColor={theme.top_tab}
      onPress={() => {}}
    />
  );
}

export default SearchIcon;

是否可以触发

onPress

功能，或者是否有其他方法可以使其工作？搜索图标在两个屏幕上，调用相同的函数是否会使

文本输入出现在两个屏幕上？
无论您在哪里使用
只需在其中添加一个类似的道具即可

<SearchIcon onPress={() => { // Do Something }} />

如果在显示的屏幕内调用了
，我假设此解决方案可以工作，但它是在屏幕上调用的。我不知道如何将
toggleSearch
传递到
onPress
函数中。很抱歉，在找到
useLayoutEffect
hook并使用导航中的
navigation.setOptions
之前，我不知道如何应用您的解决方案。谢谢你的帮助。
const [data, setData] = React.useState({
    isSearching: false,
    search: '',
...
  });

  // TRIGGERED BY SEARCH ICON IN NAV BAR
  const toggleSearch = () => setData({...data, isSearching: !isSearching});

{data.isSearching == false ? (
          <ScrollView
            ...
          </ScrollView>
        ) : (
          <View>
            <TextInput
              style={[styles.textInput, [{color: theme.text, ...FONTS.body4}]]}
              value={data.search}
              placeholder="Search..."
              placeholderTextColor={theme.text}
              onChangeText={()=>{}}
            />
          </View>
        )}

<SearchIcon onPress={() => { // Do Something }} />

function SearchIcon(props) {
  const theme = useSelector(state => state.themer.theme);
  return (
    <Icon.Button
      name="search"
      size={22}
      color={theme.icons}
      backgroundColor={theme.top_tab}
      onPress={props.onPress} // Access it here like this
    />
  );
}

export default SearchIcon;