加入收藏 | 设为首页 | 会员中心 | 我要投稿 晋中站长网 (https://www.0354zz.com/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 站长资讯 > 评论 > 正文

在iOS 与Android上实现React Native应用的尝试链接

发布时间:2019-08-19 16:05:37 所属栏目:评论 来源:魑魅魍魉
导读:我们生活在一个万物兼可分享的年代,而分享的过程,几乎最终都会分享某一个链接,那么,作为开发者,最常遇到的问题中应该包括如何通过一个URL地址快速的打开App,并导航至特定的页面。 什么是深度链接(Deep Link) 深度链接是一项可以让一个App通过一个URL

添加 src/App.tsx 文件

  1. import React from 'react' 
  2.  
  3. import { createAppContainer, createStackNavigator } from 'react-navigation' 
  4.  
  5. import About from './screens/About' 
  6. import Article from './screens/Article' 
  7. import Home from './screens/Home' 
  8.  
  9. const AppNavigator = createStackNavigator( 
  10.   { 
  11.     Home: { screen: Home }, 
  12.     About: { screen: About, path: 'about' }, 
  13.     Article: { screen: Article, path: 'article/:id' }, 
  14.   }, 
  15.   { 
  16.     initialRouteName: 'Home', 
  17.   }, 
  18.  
  19. const prefix = 'deep-linking://' 
  20.  
  21. const App = createAppContainer(AppNavigator) 
  22.  
  23. const MainApp = () => <App uriPrefix={prefix} /> 
  24.  
  25. export default MainApp 

添加 src/screens/Home.tsx 文件

  1. import React from 'react'; 

添加 src/screens/About.tsx

  1. import React from 'react' 
  2.  
  3. import { StyleSheet, Text, View } from 'react-native' 
  4.  
  5. import { NavigationScreenComponent } from 'react-navigation' 
  6.  
  7. interface IProps {} 
  8.  
  9. interface IState {} 
  10.  
  11. const AboutScreen: NavigationScreenComponent<IProps, IState> = props => { 
  12.   return ( 
  13.     <View style={styles.container}> 
  14.       <Text style={styles.title}>About Page</Text> 
  15.     </View> 
  16.   ) 
  17.  
  18. AboutScreen.navigationOptions = { 
  19.   title: 'About', 
  20.  
  21. export default AboutScreen 
  22.  
  23. const styles = StyleSheet.create({ 
  24.   container: {}, 
  25.   title: {}, 
  26. }) 

(编辑:晋中站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

热点阅读