在react-native中显示文本输入字段之前的文本

时间:2017-12-18 12:11:52

标签: react-native

我正在设计一个本地反应页面,我正在尝试构建一个左侧有文本的表单和屏幕右侧的相应文本输入字段。如下面的示例{{3} }

这是我尝试编写它的方式,但它没有显示文本输入字段。



<Text >
          Email: <TextInput placeholder="Enter email" underlineColorAndroid='transparent' style={styles.TextInputStyleClass}/>
          </Text>
&#13;
&#13;
&#13;

我一直在react.js中实现它,因为我对web的样式非常熟悉。但我在反应本土方面相当新,并且无法弄清楚如何做到这一点。我已经阅读了react-native-material-textfield的文档,但它并没有真正提供我需要的东西。任何帮助将不胜感激。

2 个答案:

答案 0 :(得分:2)

试试这个我添加了内联样式。

<View style={{flexDirection:"row",alignItems:'center'}}>
        <Text>Name:</Text>
        <TextInput
        underlineColorAndroid='transparent'
        style={{borderColor: 'gray', borderWidth: 1}}
        value="placeholder"
      />
        </View>

答案 1 :(得分:0)

你可以尝试这样的事情。

<View style={styles.row}>
  <Text>
    Email: 
  </Text>
  <TextInput 
    placeholder="Enter email" 
    underlineColorAndroid='transparent' 
    style={styles.TextInputStyleClass} 
  />
</View>

在行中,您可以使用StyleSheet flexDirection: 'row'。可能还需要一些其他调整。