React Native Web情况下自定义react-native-paper的TextInput Label

Question

我正在使用带有样式组件的 React Native Web 和 React Native Paper 库。基本上我想自定义 TextInput 内部组件：标签和html 输入

问题是：

1）如何更改标签样式？例如。宽度\尺寸\颜色等？
2）如何更改html输入样式？

我想设置outline: none为防止在浏览器中焦点上显示蓝色边框。据我所知，在本机的情况下，我们没有，html并且本机网络会对其进行转译。

我不明白如何捕获嵌套标签组件来更改其样式。因为我想在未填充时显示灰色标签，在填充时显示紫色，并且输入文本应为黑色。对于网络来说，这是微不足道的，但对于本机来说，我不知道如何处理它。

那么这有可能吗？

谢谢你的帮助。这是代码示例

import React from 'react';

import {
  View,
  Platform,
} from 'react-native';

import {
  TextInput as NativePaperInput,
  withTheme,
} from 'react-native-paper';

import styled from 'styled-components/native';

const NativePaperInputThemed = withTheme(NativePaperInput);

export const TextInputStyled = styled(NativePaperInputThemed)`
    ${(props: any) => {
      return `
        outline: none;  // doesn't work
        input: { outline: none; } // doesn't work
        & input: { outline: none; } // doesn't work
        // Label change style ? 
        color: ${props.theme.theme10x.palette.typography.placeholder}; // doesn't work


        border-color: '#f92a2a8a'; // doesn't work
        height: 52px;
      `;
    }
  }
`;

PS 基本上连颜色和 fontFamily 都不起作用

Answer 1

label={<Text style={{fontSize: 20}}>{t('PersonalDetailsYuvitalOrg:editInput.firstName')}</Text>} 

Answer 2

有人尝试手动更改标签样式，维护者回应：

您可以通过 style 属性传递 fontSize。但是，它会影响标签和输入文本。没有办法只改变其中之一。

https://github.com/callstack/react-native-paper/issues/1505