代码之家 › 专栏 › 技术社区 › Giannis

ReactNative TextInput在iOS上不可见

react-native ios

Giannis · 技术社区 · 10 年前

我有以下精简的渲染结果:

return (
  <View style={{backgroundColor:'red'}}>
    <TextInput value={'Hello'}/>
  </View>
);

生成的TextInput在iOS中不可见,除非我指定了高度,并且在其容器中使用flexDirection:'row'时,我还需要指定其宽度。

这只发生在iOS上,Android似乎可以正常工作。

有没有一种在iOS中显示文本输入而不固定大小的方法?

当前依赖关系:

  "dependencies": {
    "react-native": "=0.18.1",
    "react-native-orientation": "=1.12.2",
    "react-native-vector-icons": "=1.1.0"
  },

网间网操作系统:

安卓:

按如下方式更改渲染:

return (
  <View style={{backgroundColor:'red'}}>
    <Text>text</Text>
    <TextInput value={'Hello'}/>
  </View>
);

具有以下结果:

网间网操作系统:

安卓:

4 回复 | 直到 10 年前

Nader Dabit 9 年前

您需要定义文本输入的高度。尝试:

return (
  <View style={{backgroundColor:'red'}}>
    <Text>text</Text>
    <TextInput style={{ backgroundColor: '#ededed', height: 60 }} value={'Hello'}/>
  </View>
);

或者,如果不想在TextInput上定义高度,可以在包含视图上定义高度并在TextInput:

<View style={{ height:60 }}>
    <TextInput style={{ flex:1, backgroundColor: '#ededed' }} />
</View>

mad_greasemonkey 8 年前

面临同样的问题,但当我删除 alignItems:'center' 从中最顶部的父视图 render() 作用

KetZoomer Gael Ramirez 5 年前

使用 style={{ color: 'black' }} .

这解决了问题。

Dulanga Heshan 7 年前

当我们在react native中使用TextInput时,默认情况下TextInput不会扩展以填充可用空间,而是必须添加样式规则,即TextInput应该有多大。如果不为TextInput添加高度样式,则无法显示TextInput

推荐文章

sudoExclamationExclamation · iOS自动布局-高度不能小于ThanOrEqualTo

1 年前

Tulon · Firebase身份验证SwiftUI:更改密码后,电子邮件验证状态变为真

1 年前

Danil · 种子/填充核心数据的最佳实践?[关闭]

1 年前

HeWhoRemains · 如何在SwiftUI中创建圆形文本,根据度数变化从一条直线变为一个完美的圆?

1 年前

Robin · LazyVGrid项目预计不会击中测试区域

1 年前

Mahendra · Popover不是从SwiftUI中的项目列表中打开的[重复]

1 年前

Alex Smith · 移动到下一个视图控制器后如何显示警报?

1 年前

sadiq shareef · 即使更新了我的苹果应用程序网站关联文件,iOS应用程序也不会在点击网址时启动

1 年前

selcukctn · 如何在react native中制作无限动画?

1 年前

Nicolas Gimelli · iOS 18远程通信通知不起作用

1 年前