[React Native] Using the WebView component
2016-08-03 01:52
405 查看
We can access web pages in our React Native application using the WebView component. We will connect the links in our repository component to their Github web page when a user click on them.
Navigate to WebView component:
Web View Compnent:
Navigate to WebView component:
openPage(url){ this.props.navigator.push({ component: Web, title: 'Web View', passProps: {url} }); }
Web View Compnent:
import React from 'react'; import { View, WebView, StyleSheet } from 'react-native'; var styles = StyleSheet.create({ container: { flex: 1, backgroundColor: '#F6F6EF', flexDirection: 'column', }, }); class Web extends React.Component{ render(){ return ( <View style={styles.container}> <WebView source={{uri: this.props.url}} /> </View> ); } } Web.propTypes = { url: React.PropTypes.string.isRequired }; module.exports = Web;
相关文章推荐
- android:RadioButton自定义和非自定义的实现
- Android官方文档之Location and Sensors APIs(上)
- Android中TextView不能识别电信号码11888的问题。
- iOS 从Objective-C到Swift
- Swift与OC的对比
- Unity 法线翻转
- 利用面向对象的思想实现一套代码,要求一个APP支持微信支付,支付宝支付,银联支付
- iOS真机调试-Your maximum App ID limit has been reached. You may create up to 10 App IDs every 7 days
- 优雅地实现Android Toolbar及沉浸式状态栏(二)
- php微信开发之带参数二维码的使用
- 微信公众号掉粉?那是因为你忘了做这些
- Android 多线程编程的总结
- 那些年提交 AppStore 审核踩过的坑
- 微信营销平台如何短期内快速吸粉?
- 分享磨砺营马剑威老师讲解-Android开发中多线程的使用
- 30天学习Swift项目实战第二天--------自定义字体
- mybatis 错误提示:is not known to the MapperRegistry.
- 加密算法,线程实例,MQ文件队列,微信开发
- 编译可在Nexus5上运行的CyanogenMod13.0 ROM(基于Android6.0)
- 广州APP开发公司—社交app开发具体有哪些功能呢