React Native 无法在 TextInput 中聚焦

贤俊吴
class Main extends Component {
    constructor(props) {
        super(props)
        this.state = {
            id: '',
            password: '',
        }
        console.log('yes')
        this._handleTextChange = this._handleTextChange.bind(this)
    }

    _handleTextChange(id, text) {
        console.log(text)
        var newState = Object.assign({}, this.state);
        var newState = Object.assign({}, this.state);
        newState[id] = text
        this.setState(newState)
    }

    render() {
        console.log('ass')
        return (
            <View style={MainStyle.justFlexOne}>
                <View style={MainStyle.coverImageWrapper}>
                    <Image source={require('../assets/images/cursive.jpg')} style={MainStyle.coverImage}/>
                </View>
                <View style={MainStyle.mainBackground}>
                    <TouchableHighlight>
                        <Text style={MainStyle.bigFontDefault}>
                            Comma
                        </Text>
                    </TouchableHighlight>
                    <TextInput
                        style={MainStyle.TextInputs}
                        value={this.state.id}
                        editable={true}
                        onChangeText={(text) => {console.log('asdf');this.setState({id:text})}}
                        placeholder='text'
                    />
                </View>
            </View>
        )

    }
}

const MainStyle = StyleSheet.create({
    justFlexOne: {
        flex: 1,
    },
    mainBackground: {
        flex: 1,
        justifyContent: 'center',
        alignItems: 'center',
        backgroundColor: 'transparent',
    },
    bigFontDefault: {
        color: '#fafafa',
        fontSize: 60,
        textShadowOffset: {width: 0, height: 1},
        textShadowRadius: 8,
        textShadowColor: 'rgba(21,42,55,0.4)',
        fontFamily: 'Optima-Italic',
        fontWeight: '500',

    },
    coverImageWrapper: {
        position: 'absolute',
        top: 0, left: 0, bottom: 0, right: 0,
    },
    coverImage: {
        flex: 1,
        width: null,
        height: null,
        resizeMode: 'cover',
    },
    textInputs: {
        height: 40,
        width: 200,
        color: '#fcc439',
        backgroundColor: 'rgba(0,0,0,0.4)',
        borderColor: '#fcc439',
    }
})

问题是,我无法在由 XCode(版本 8.2.1)操作的iOS 模拟器上专注于 TextInput 。(这意味着我无法在输入中键入一些字符。)我已经完成了我可以处理的操作(例如单击、输入等...) 使用 mac 键盘、触控板甚至苹果鼠标。尽管连接硬件键盘已打开。

StyleSheet 也不适用于 TextInput。(它适用于其他组件。)

我该如何解决这个问题??

维纳尔

改变

style={MainStyle.TextInputs}

style={MainStyle.textInputs}

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在React Native Android中聚焦TextInput

来自分类Dev

无法在React Native中更改或使用导入的TextInput的属性

来自分类Dev

React Native中的隐藏TextInput

来自分类Dev

聚焦时如何摆脱React Native Paper TextInput的底部边框

来自分类Dev

React-Native - TextInput 中的 Firebase 数据

来自分类Dev

按下TextInput组件中的按键时无法更改状态(React Native)

来自分类Dev

无法在React Native TextInput组件中键入任何内容

来自分类Dev

React Native:无法更改<TextInput>组件中文本的颜色

来自分类Dev

React-native textInput onFocus无法正常工作

来自分类Dev

无法在React Native TextInput组件中键入任何内容

来自分类Dev

在React Native中关闭多行TextInput中的键盘

来自分类Dev

React-Native自动完成输入中textInput中的边框

来自分类常见问题

如何在React Native中设置TextInput的样式以输入密码

来自分类Dev

react-native中TextInput的焦点样式

来自分类Dev

如何在React Native中验证TextInput值?

来自分类Dev

在React Native中触摸TextInput时打开键盘和/或DatePickerIOS

来自分类Dev

如何在React Native中更改TextInput占位符的样式?

来自分类Dev

React-Native中的TextInput怪异行为

来自分类Dev

React Native中TextInput上的线性渐变BorderColor

来自分类Dev

React Native中TextInput的onChange事件的TypeScript类型

来自分类Dev

React Native:此TextInput代码中的onChangeText如何传递值?

来自分类Dev

如何在React Native TextInput中更改光标的宽度?

来自分类Dev

在React Native TextInput中更改单个单词的颜色

来自分类Dev

当react-native中的textinput处于焦点时获取坐标

来自分类Dev

React Native:放入视图时TextInput消失

来自分类Dev

React Native Password TextInput引发警告

来自分类Dev

React Native Controller FormData TextInput不重置

来自分类Dev

React Native Set TextInput Value大写

来自分类Dev

React Native:如何在React Native中发送TextInput的值?

Related 相关文章

  1. 1

    如何在React Native Android中聚焦TextInput

  2. 2

    无法在React Native中更改或使用导入的TextInput的属性

  3. 3

    React Native中的隐藏TextInput

  4. 4

    聚焦时如何摆脱React Native Paper TextInput的底部边框

  5. 5

    React-Native - TextInput 中的 Firebase 数据

  6. 6

    按下TextInput组件中的按键时无法更改状态(React Native)

  7. 7

    无法在React Native TextInput组件中键入任何内容

  8. 8

    React Native:无法更改<TextInput>组件中文本的颜色

  9. 9

    React-native textInput onFocus无法正常工作

  10. 10

    无法在React Native TextInput组件中键入任何内容

  11. 11

    在React Native中关闭多行TextInput中的键盘

  12. 12

    React-Native自动完成输入中textInput中的边框

  13. 13

    如何在React Native中设置TextInput的样式以输入密码

  14. 14

    react-native中TextInput的焦点样式

  15. 15

    如何在React Native中验证TextInput值?

  16. 16

    在React Native中触摸TextInput时打开键盘和/或DatePickerIOS

  17. 17

    如何在React Native中更改TextInput占位符的样式?

  18. 18

    React-Native中的TextInput怪异行为

  19. 19

    React Native中TextInput上的线性渐变BorderColor

  20. 20

    React Native中TextInput的onChange事件的TypeScript类型

  21. 21

    React Native:此TextInput代码中的onChangeText如何传递值?

  22. 22

    如何在React Native TextInput中更改光标的宽度?

  23. 23

    在React Native TextInput中更改单个单词的颜色

  24. 24

    当react-native中的textinput处于焦点时获取坐标

  25. 25

    React Native:放入视图时TextInput消失

  26. 26

    React Native Password TextInput引发警告

  27. 27

    React Native Controller FormData TextInput不重置

  28. 28

    React Native Set TextInput Value大写

  29. 29

    React Native:如何在React Native中发送TextInput的值?

热门标签

归档