我想以具有本机输入文本的react native形式创建。 就像这里显示的https://material.angular.io/components/input/overview
这是我的代码
import React, { Component } from "react";
import { Platform, StyleSheet, Text, View, TextInput } from "react-
native";
export default class App extends Component<Props> {
render() {
return <TextInput style={styles.abcd} placeholder="Enter name" />;
}
}
const styles = StyleSheet.create({
abcd: {
borderBottomWidth: 0.25,
marginVertical: 2,
paddingHorizontal: 10
}
});
在这里,我使用了占位符,但是如果您在给定的链接中看到该表单,则它不是占位符。同样,当我们单击该字段时,文本也在向上移动。我想在这里实现同样的目标。 我不想使用诸如textField之类的任何库或任何其他库。
答案 0 :(得分:0)
TextInput组件上的placeholder
道具的占位符文本在输入开始时就消失了。为了实现您想要的操作,可以将Text组件覆盖在TextInput组件上,并将其样式映射到状态变量。聚焦后,相应地更改Text组件的样式。
答案 1 :(得分:0)
哥们, 有两件事 1.默认情况下,React-Native材质输入框仅在Android中可用。 2.在iOS(iPhone或iPad)上,您将看到普通的InputBox
要在iOS设备上查看材料输入框,您必须进行大量编码。最好的解决方案是集成react-native-paper
这样的第三方库请在此处参考react-native-paper
库
https://github.com/callstack/react-native-paper/blob/master/example/src/TextInputExample.js