主页 / coding / 问题 / 76935205
Accepted
MHS
Asked: 2023-08-19 20:55:31 +0800 CST

为什么IOS多行文本输入在React原生纸张对话框中无法正常工作？

  • 772

我是 React Native 的初学者，我试图在对话框中进行多行文本输入（来自 React Native Paper 模块的对话框组件），它在 Android 和 Web 上完美运行，但在 IOS 上不起作用。

有我的代码：

      <Dialog
        visible={isDialogVisible}
        onDismiss={() => setIsDialogVisible(false)}>
        <TextInput
          multiline
          style={{
            height: 150,
            borderWidth: 1,
          }}
          value={inputVal}
          onChangeText={(text) => setInputVal(text)}
        />

        <Dialog.Actions>
          <Button onPress={() => setIsDialogVisible(false)}>Done</Button>
        </Dialog.Actions>
      </Dialog>

您还可以查看此演示链接：

https://snack.expo.dev/@mohsenkh90/react-native-paper-dialog-with-textinput

ios

1 个回答

  1. Best Answer

    这似乎是 React Native 中的一个已知问题。

    1. 门户内的 TextInput 有问题
    2. 当 TextInput 位于 Portal 内时，光标在编辑时会跳转

    这里提供了一个解决方法：通过为门户创建 HOC

    defaultValue或者一个简单的解决方法是作为 prop传递给TextInput而不是value

      <Dialog
    visible={isDialogVisible}
    onDismiss={() => setIsDialogVisible(false)}>
    <TextInput
      multiline
      style={{
        height: 150,
        borderWidth: 1,
      }}
      defaultValue={inputVal}                     //changed the prop
      onChangeText={(text) => setInputVal(text)}
    />

    <Dialog.Actions>
      <Button onPress={() => setIsDialogVisible(false)}>Done</Button>
    </Dialog.Actions>
  </Dialog>

    参考：https://stackoverflow.com/a/64945998/10657559

    • 1

相关问题