焦点热门:react怎么实现密码隐藏功能

(资料图)

本教程操作环境：Windows10系统、React Native0.67版、Dell G3电脑。

react怎么实现密码隐藏功能？

React Native 密码输入的显示与隐藏 Image点击事件眼睛输入框密码

1.效果图

2.添加依赖

import {  View,  Text,  TouchableWithoutFeedback,  TextInput,  Image,  StyleSheet,} from "react-native";
登录后复制

3.代码功能实现

export default class App extends Component {  constructor(props) {    super(props);    this.state = {      imageState: false,    };  }  render() {    return (                        请输入密码:                      test12345test                                {this.state.imageState ? (              ) : ()}                            );  }  onPressChang = () => {    this.setState({      imageState: !this.state.imageState,    });  };}const pageStyle = StyleSheet.create({  textInfoStyle: {    alignSelf: "center",    marginLeft: 40,    color: "#343434",    fontSize: 16,    flex: 1,  },  textStyle: {    alignSelf: "center",    marginLeft: 10,    color: "#343434",    fontSize: 16,  },});
登录后复制

推荐学习：《react视频教程》

以上就是react怎么实现密码隐藏功能的详细内容，更多请关注php中文网其它相关文章！

关键词：相关文章是否可编辑视频教程