小编Rid*_*ler的帖子

Modal中React原生纸张TextInput，输入一个字符后光标向后闪烁

React Native 论文中 Modal 上 TextInput 的一些奇怪行为。当我输入一个字符时，它被输入到文本框中，但随后光标闪回（就像被删除一样），然后又重新出现。这一切发生得非常快，并且保留了角色，但这一切看起来有点卡顿。下面的GIF来说明：

对于模式来说，代码相当简单：

import { Portal, Modal, Button, Title, Text, TextInput } from 'react-native-paper'; 

const [nameNew, setNameNew] = useState('')
const [emailNew, setEmailNew] = useState('')

const renderModalAddPerson = () => {
    return (
      <Portal>
        <Modal visible={visibleModalAddPerson} onDismiss={closeModalAddPerson} contentContainerStyle={styles.modalContainer}>
          <View>
            <Title style={{alignSelf:'center'}}>Title here</Title>
            <Text>  </Text>
            <TextInput
              mode="outlined"
              label="Name"
              style={{alignSelf:'center', width:'95%'}}
              value={nameNew}
              onChangeText={nameNew => setNameNew(nameNew)}
              ref={input1}
              returnKeyType='next'
              blurOnSubmit={false}
              onSubmitEditing={() => input2.current.focus()}
            />
            <TextInput
              mode="outlined"
              label="Email"
              style={{alignSelf:'center', width:'95%'}}
              value={emailNew}
              onChangeText={emailNew => setEmailNew(emailNew)}
              ref={input2}
              returnKeyType='done'
              blurOnSubmit={false}
              onSubmitEditing={() => addPerson()}
            /> …

Run Code Online (Sandbox Code Playgroud)

javascript reactjs react-native react-native-paper react-native-modal

Rid*_*ler

2020 11-20

5
推荐指数

1
解决办法

1926
查看次数