问题标签 [react-native-textinput]

当我在 react-native-web 项目中选择 TextInput 时，我正在寻找禁用或更改自动缩放行为的方法。这不是我在 react-native 项目中遇到的问题，仅在使用 react-native-web 的项目中。它抛弃了我的布局，因为当我选择 TextInput 时它会放大，但从不缩小，即使我导航到同一项目中的另一个屏幕也是如此。我最终得到的屏幕比手机屏幕宽，底部有一个滚动条。

以下是我迄今为止尝试过但对我不起作用的解决方案：

1. 将 TextInput 的 height 和 maxHeight 设置为相同的值，并将 TextInput 的 width 和 maxWidth 设置为相同的值。这似乎被完全忽略了，没有任何区别。

2. 在设置高度/宽度的视图中包含文本输入和/或在设置高度/宽度的视图中包含整个组件或屏幕。这不起作用，因为如果 TextInputs 展开，它将不会停留在 View 的边界内。

3. 在屏幕的主视图周围放置边距和填充。这只会补偿行为而不是停止它。这还不够。

4. 我查看了纵横比的文档，但我认为这不会有帮助，因为据我所知纵横比没有改变。

这是我遇到此问题的代码示例：

这是我的样式：

当我在浏览器中打开开发人员工具时，我看到 react-native-web 将其翻译为：

任何建议表示赞赏。谢谢，

我是 ReactNative 的新手，我正在尝试在我的 TextBoxes 上书写。虽然，我不能输入任何东西。这是我在 Signup.js 上的文本输入段

我不明白为什么会这样。请帮我

我有这个奇怪的问题，当 TextInput 放置在子功能组件中时，键盘在输入时一直关闭。如果 TextInput 直接放在父组件下，则不存在此问题。这是我的代码

如果我将所有内容 < SignInForm> 直接粘贴到渲染方法，一切正常。

我的代码中有一个 TextInput 在提交后不会自行清除，我不知道它为什么这样做或如何解决它。我看过其他有这种问题的帖子？但没有一个有效，或者我真的不知道在哪里放置代码以在提交后使其清楚。

代码

我陷入了一个看似简单的功能。如何从 TextInput 中获取值（字符串）？

这里是代码的摘录：

我在输入时得到了输入，但它没有提交任何内容。

有什么想法吗？

提前致谢！

我有一个功能组件，它是一个屏幕，我需要处理一些状态。我不想重构我的代码以使其成为类组件，我想使用钩子。我在屏幕中有一个组件，它呈现产品描述、数量和用户输入数量框的平面列表（来自 JSON）。目前我所有输入量的状态都绑定在一起，所以当我在 1 个框中输入一个数字时，所有框中都会显示相同的数字。如何使用钩子分离和存储输入状态？

网上有很多使用钩子存储 1 个数据但不是多个数据的示例，因为我不知道会有多少“产品”，所以我无法为它们创建不同的 useState。我最好为所有输入框使用 1 个 useState 并存储在数组中吗？

描述组件

我一直在挖掘，我似乎无法找到一种合适的方法来关注表单中的下一个 TextInput。我正在使用 React Native 0.61.5 和 React 16.9.0 并使用 Typescript 模板设置项目。我在网上找到的大部分内容都使用早期版本的 React Native 或 React，我无法降级，因为这是一个公司项目，我们使用的版本取决于开发主管。

React Native 的文档https://facebook.github.io/react-native/docs/textinput#__docusaurus没有显示 TextInput 上存在的 .focus() 方法。有 onFocus，但它发生在 TextInput 获得焦点之后，它不能帮助我们在按下返回键后将焦点设置到屏幕上的特定 TextInput。

使用 refs 是一个不错的主意：

inputRef = React.createRef<'TextInput>(); //（<后面的逗号因为它一直隐藏代码）

将鼠标悬停在 inputRef 上的 Intellisense：（属性）LoginForm.inputRef：React.RefObject<'TextInput> //（< 后面的逗号，因为它一直隐藏代码）

我正在像这样使用这个参考：

this.inputRef?.current?.focus();

但我不断收到打字稿错误说：

类型“TextInput”上不存在属性“焦点”。

鉴于文档，这是有道理的，因为我在那里找不到它作为财产。

将鼠标悬停在 ref 属性上时 TextInput 的智能感知：（JSX 属性）React.ClassAttributes.ref?: string | ((实例：TextInput | null) => void) | React.RefObject | 空 | 不明确的

我希望能够点击 android/ios 虚拟键盘上的返回键并将焦点转移到下一个 TextInput 以便我可以提交表单。

我正在使用0.61.4React Naive 版本，我发现这是一个奇怪的问题。

当专注于 TextInput（使用默认道具）时，我收到以下错误：

尝试在已移动到“本机”的动画节点上运行 JS 驱动动画，方法是使用useNativeDriver: true

注意：当输入位于页面的下半部分时会出现此问题。

问题：

我在 ios 中使用KeyboardAvoidingViewbehavior="padding"但它不起作用。我的屏幕有四个文本输入字段，它们在打开时被键盘隐藏。

代码：

屏幕：

文本输入样式：

预期行为：

KeyboardAvoidView应在键盘打开后立即将所有文本输入字段向上移动。

我怎样才能隐藏这张照片......谢谢你的帮助！