reactnativemodal
'use strict'; var React = require('react-native');
var Modal = require('react-native-modal');
var { AppRegistry, StyleSheet, View, Text } = React; class App extends React.Component {
constructor() {
this.state = {
isModalOpen: false
};
} openModal() {
this.setState({isModalOpen: true});
} closeModal() {
this.setState({isModalOpen: false});
} render() {
return (
<View style={styles.page}>
<Text onPress={() => this.openModal()}>
Open Modal.
</Text>
<Modal isVisible={this.state.isModalOpen} onClose={() => this.closeModal()}>
<Text>Hello world!</Text>
</Modal>
</View>
);
}
} var styles = StyleSheet.create({
page: {
flex: 1,
position: 'absolute',
bottom: 0,
left: 0,
right: 0,
top: 0
}
}); AppRegistry.registerComponent('App', () => App);
var App = React.createClass({
mixins: [Modal.Mixin], render() {
return (
<View style={styles.page}>
<Text onPress={() => this.openModal()}>
Open Modal.
</Text>
<Modal backdropType="blur" isVisible={this.state.isModalOpen} onClose={() => this.closeModal()}>
<Text>Hello world!</Text>
</Modal>
</View>
);
}
}
reactnativemodal的更多相关文章
- React Native初探
前言 很久之前就想研究React Native了,但是一直没有落地的机会,我一直认为一个技术要有落地的场景才有研究的意义,刚好最近迎来了新的APP,在可控的范围内,我们可以在上面做任何想做的事情. P ...
- iOS、swift、React Native学习常用的社区、论坛
<!----iOS> <!----Swift>*IOS开发常用社区:http://code4app.com/ *IOS开发常用社区:http://www.cocoachina. ...
- react native 常用组件汇总
react-native-uploader //文件上传https://github.com/aroth/react-native-uploader jpush-react-native //官方版本 ...
- react-native 插件汇总
部分自己搜集 部分 来自别的网站 第三方路由插件 react-native-router-flux react-native-scrollable-tab-view 选项卡 测滑动菜单 react-n ...
- React Native常用第三方组件汇总--史上最全 之一
React Native 项目常用第三方组件汇总: react-native-animatable 动画 react-native-carousel 轮播 react-native-countdown ...
- 【优质】React的学习资源
React的学习资源 github 地址: https://github.com/LeuisKen/react-collection https://github.com/reactnativecn/ ...
- React Native常用第三方组件汇总--史上最全[转]
本文出处: http://blog.csdn.net/chichengjunma/article/details/52920137 React Native 项目常用第三方组件汇总: react-na ...
- React Native指南汇集了各类react-native学习资源、开源App和组件
来自:https://github.com/ele828/react-native-guide React Native指南汇集了各类react-native学习资源.开源App和组件 React-N ...
- React Native常用的第三方开源库
记录一下自己暂目前了解和使用的一些开源库和官方文档和优秀博客介绍,希望对你有帮助☺️: 1.Toast: https://github.com/magicismight/react-native-ro ...
随机推荐
- HDU 4832 Chess(DP+组合数学)(2014年百度之星程序设计大赛 - 初赛(第二轮))
Problem Description 小度和小良最近又迷上了下棋.棋盘一共有N行M列,我们可以把左上角的格子定为(1,1),右下角的格子定为(N,M).在他们的规则中,“王”在棋盘上的走法遵循十字路 ...
- MyEclipse 死掉,JVM terminated. Exit code=1073807364
刚入手的新成员,刚开始使用myeclipse,是不是会有一大堆的问题,然后没有目标的走,这里有个小技巧,那就是如果做项目出现问题,一定要自己现在网络搜寻答案,网络时代.技术时代走到现在,一定有他的道理 ...
- ASP.NET MVC (一)
工作清闲好一段时间了,趁这段时间弄了弄PHP,做个了简单的MVC网页.玩了玩Android,弄了个拨号器,发短信的,嘿嘿,最满意的还是两天弄了个数独游戏.不务正业一个多月了,也该磨磨刀,接下来一段时间 ...
- 查找(AVL平衡二叉树)
[1]为什么需要平衡二叉树? 矛盾是推进事物向前发展的源动力. 那么平衡二叉树是从哪里来?肯定是有矛盾存在的.请看程来师的分析: [2]什么是平衡二叉树? 平衡二叉树的基本认识: [3]平衡二叉树的构 ...
- android 学习随笔二十七(JNI:Java Native Interface,JAVA原生接口 )
JNI(Java Native Interface,JAVA原生接口) 使用JNI可以使Java代码和其他语言写的代码(如C/C++代码)进行交互. 问:为什么要进行交互? 首先,Java语言提供的类 ...
- plsql 简单介绍
plsql的安装: 1. 安装plsql developer 2. 下载,解压instantclient到任意目录 3. 在instantclient解压目录下,新建NETWORK目录,在该目录下建A ...
- Delphi 的各版本定义,用于预编译参数中,避免忘记备忘之
DELPHI的版本宏: VER80 - Delphi 1 VER90 - Delphi 2 VER100 - Delphi 3 VER120 - Delphi 4 VER130 - Delphi 5 ...
- JVM学习笔记(三)------内存管理和垃圾回收【转】
转自:http://blog.csdn.net/cutesource/article/details/5906705 版权声明:本文为博主原创文章,未经博主允许不得转载. JVM内存组成结构 JVM栈 ...
- SVN上传文件注意事项-------------------养成良好的项目文件上传习惯
项目组的学弟经常把一些.obj文件和debug目录上传到svn,这个习惯很不好,我说了很多次他总改不了,还是写个文档说清楚吧,以后查起来也方便. svn是一种版本控制工具,主要目的是用来管理代 ...
- 使用phpmyadmin导入SQL数据报错:#1062 - Duplicate entry '...
使用phpmyadmin导入SQL数据报错: MySQL 返回: #1062 - Duplicate entry '0' for key 'PRIMARY' 出现此错误的原因是数据的主键重复了,错误信 ...