react-native – ExNavigation:如何将道具传递给所有路由器组件
发布时间:2020-12-15 20:18:56 所属栏目:百科 来源:网络整理
导读:在下面的代码中,将数据库变量作为props传递给Router / NavigationProvider提供的所有组件的最佳方法是什么? import { createRouter,NavigationProvider,StackNavigation,} from '@exponent/ex-navigation'const Router = createRouter(() = ({ jobs: () = J
在下面的代码中,将数据库变量作为props传递给Router / NavigationProvider提供的所有组件的最佳方法是什么?
import { createRouter,NavigationProvider,StackNavigation,} from '@exponent/ex-navigation' const Router = createRouter(() => ({ jobs: () => Jobs,sample: () => Sample })) render () { const database = this.openDatabase() <NavigationProvider router={Router}> <StackNavigation initialRoute={Router.getRoute('home')} /> </NavigationProvider> } 谢谢! 解决方法
您应该创建一个新的javascript文件,该文件导出您的数据库连接并将其导入您希望使用它的组件中.
您还可以创建更高阶的组件,该组件将数据库连接作为组件的支柱.这类似于withNavigation,它内置于ExNavigation或者连接Redux的React绑定. 但是,由于HOC是一个有点高级的主题(但不难理解!)这里有一个没有它的例子. 服务/ database.js // Open database connection here and export it like any other module. // The following is pseudo code to illustrate example import { database } from 'database' export default database.connect() routes.js import Jobs from './containers/Jobs' import Sample from './containers/Sample' import { createRouter } from '@exponent/ex-navigation' const Router = createRouter(() => ({ jobs: () => Jobs,sample: () => Sample })) export default Router App.js import React from 'react' import { NavigationProvider,} from '@exponent/ex-navigation' const App = () => ( <NavigationProvider router={Router}> <StackNavigation initialRoute={Router.getRoute('home')} /> </NavigationProvider> ) export default App 集装箱/ Jobs.js import React,{ Component } from 'react' // Import database connection in every container component you wish to use it import databaseConnection from '../services/database' export default class Jobs extends Component { state = { jobs: [] } componentDidMount() { databaseConnection .get('jobs') .then(jobs => this.setState({ jobs })) } render() { return ( {this.state.jobs.map(job => // Render jobs )} ) } } (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |