如何在React Native中创建clear按钮

import React from 'react';
import { TouchableOpacity, Text } from 'react-native';

const ClearButton = ({ onPress }) => {
  return (
    <TouchableOpacity onPress={onPress}>
      <Text>Clear</Text>
    </TouchableOpacity>
  );
};

export default ClearButton;

import React, { useState } from 'react';
import { View, TextInput } from 'react-native';
import ClearButton from './ClearButton';

const App = () => {
  const [text, setText] = useState('');

  const clearText = () => {
    setText('');
  };

  return (
    <View>
      <TextInput value={text} onChangeText={setText} />
      <ClearButton onPress={clearText} />
    </View>
  );
};

export default App;