Как передать значение bottomNavigatorStack на все остальные экраны? - PullRequest
Новая
       7

Как передать значение bottomNavigatorStack на все остальные экраны?

0 голосов
/ 21 апреля 2020

У меня есть companyId и это значение companyId . Я хочу передать его на все остальные экраны через bottomTabNavigation. Страница bottomtabStack.jsx содержит bottomTabNavigation, где все SalaryBreakUps, EmployeeList, Attendance, CostSheet будут перенаправлены на соответствующую страницу. В bottomtabStack.jsx я могу получить companyId, но хочу передать его в costSheet.jsx. Как получить эти значения?

Это мой bottomtabStack.jsx 

import * as React from 'react';
import { Icon } from 'native-base';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';
import SalaryBreakUps from './SalaryBreakUps';
import EmployeeList from './EmployeeList';
import Attendance from './Attendance';
import CostSheet from './CostSheet';

const Tab = createBottomTabNavigator();

function MyTabs() {
    return (
        <Tab.Navigator>
            <Tab.Screen 
                name="Salary Break Ups"
                component={SalaryBreakUps}
                options={{
                    tabBarIcon: ({ tintColor }) => (
                        <Icon name="flash" color={tintColor} size={25} />
                    )
                }} />
            <Tab.Screen
                name="Employee List"
                component={EmployeeList}
                options={{
                    tabBarIcon: ({ tintColor }) => (
                        <Icon name="list-box" color={tintColor} size={25} />
                    )
                }} />
            <Tab.Screen 
                name="Attendance"
                component={Attendance}
                options={{
                    tabBarIcon: ({ tintColor }) => (
                        <Icon name="stats" color={tintColor} size={25} />
                    )
                }} />
            <Tab.Screen
                name="Cost Sheet"
                component={CostSheet}
                options={{
                    tabBarIcon: ({ tintColor }) => (
                        <Icon name="logo-twitch" color={tintColor} size={25} />
                    )
                }} />
        </Tab.Navigator >
    );
}


export default (props) => {
    console.log("company details props.", props);
    alert(props.route.params.companyId + "  is the company ID selected")
    const companyId = props.route.params.companyId
    return (
        <MyTabs companyId={companyId} />
    );
}

Это CostSheet.jsx 

import React from 'react';
import { Center } from '../../Components/Center';
import {CardDetails} from './CardViewDetails';

export default (props) => {
    console.log("Cost SHeet props", props);
    return (
        <Center>
            <CardDetails/>
        </Center>
    )
}

Таким образом, я хочу, чтобы companyId был в CostSheet.jsx ... как мне этого добиться.

...