React Native使用NativeBase出现darkText对比度1:1警告该如何修复

这个警告由NativeBase内置的无障碍检测逻辑触发，你在UserListScreen页面中使用的Input组件未设置明确的背景色，导致深色文本叠加在透明背景上的对比度仅为1:1，低于WCAG要求的最低3:1标准。

• 局部修复单个Input组件
  直接给出现警告的Input组件设置明确的背景色与适配的文字颜色即可：

<Input bg="#ffffff" color="#000000" placeholder="搜索用户" />

你也可以替换为你项目主题中对应的色值token，比如bg="gray.50" color="gray.900"。

• 全局关闭对比度检测警告
  如果你不需要NativeBase的无障碍对比度校验功能，可以直接在NativeBaseProvider的配置中关闭对应检测：

import { NativeBaseProvider } from 'native-base';

export default function App() {
  return (
    <NativeBaseProvider
      config={{
        disableContrastCheck: true
      }}
    >
      {/* 你的应用根组件内容 */}
    </NativeBaseProvider>
  )
}

• 全局修改Input默认样式
  如果项目中所有Input都需要统一的背景和文字样式，可以通过自定义主题统一配置，避免每个组件单独设置：

import { NativeBaseProvider, extendTheme } from 'native-base';

const customTheme = extendTheme({
  components: {
    Input: {
      defaultProps: {
        bg: 'white',
        color: 'dark.800'
      }
    }
  }
})

export default function App() {
  return (
    <NativeBaseProvider theme={customTheme}>
      {/* 你的应用根组件内容 */}
    </NativeBaseProvider>
  )
}

提示：如果业务场景必须使用透明背景的Input，请调整文字颜色保证和Input父容器背景的对比度≥3:1，符合无障碍规范要求

内容的提问来源于stack exchange，提问作者preston