如何在react本机中使用TextInput显示工具提示错误

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

const [error, setError] = useState('');

<TextInput
  onChangeText={(text) => {
    if (text.length < 5) {
      setError('输入长度不能小于5');
    } else {
      setError('');
    }
  }}
/>

{error ? <Text style={{ color: 'red' }}>{error}</Text> : null}

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

const MyComponent = () => {
  const [error, setError] = useState('');

  return (
    <>
      <TextInput
        onChangeText={(text) => {
          if (text.length < 5) {
            setError('输入长度不能小于5');
          } else {
            setError('');
          }
        }}
      />
      {error ? <Text style={{ color: 'red' }}>{error}</Text> : null}
    </>
  );
};

export default MyComponent;