React native 反应导航-如何更改状态并在页面上使用？（本地反应）

下面是代码

我试着在右边的头上放一个daterangepicker按钮。 当我被点击时，我必须启动“setState”函数并更改“dates”参数

毕竟,；我想将该参数发送到每个页面

但如何使用函数呢？ 有什么选择吗

我试着去做

const [dates, setDates] = useState({});

但它当然不起作用。有解决办法吗

AppNavigator.js

import React, { useEffect, useState } from 'react';
import { createAppContainer, createStackNavigator, createSwitchNavigator } from 'react-navigation'
import { Image, Button, Dimensions } from 'react-native'
import { Icon, DatePicker } from 'native-base';

import AuthScreen from 'App/Containers/Auth/AuthScreen'
import DashboardScreen from 'App/Containers/Dashboard/DashboardScreen'
import DeepLinkingScreen from 'App/Containers/DeepLinking/DeepLinkingScreen'
import SplashScreen from 'App/Containers/SplashScreen/SplashScreen'
import NewProcessScreen from 'App/Containers/Process/NewProcessScreen'
import { Config } from 'App/Config'

import DateRangePicker from "react-native-daterange-picker";
import moment from "moment/min/moment-with-locales";
moment.locale("tr");

const screenWidth = Dimensions.get("window").width;
const screenWHeight = Dimensions.get("window").height;
/**
 * The root screen contains the application's navigation.
 *
 * @see https://reactnavigation.org/docs/en/hello-react-navigation.html#creating-a-stack-navigator
 */

const uri = Config.LOGO_URL;
const white_logo = Config.LOGO_WHITE;

const AuthStack = createStackNavigator(
  {
    SplashScreen: SplashScreen,
    Auth: {
      screen: AuthScreen,
      navigationOptions: {
        header: null,
      },
    },
    Dashboard: {
      screen: DashboardScreen,
      navigationOptions: { 
        headerStyle: {
          backgroundColor:'#3b7a99',
          shadowColor: 'transparent',
          shadowRadius: 0,
          shadowOffset: {
              height: 0,
          }
        },
        headerTitle: (
          <>
          <Image style={{ height: 55, width:120 }} resizeMode="contain" source={{uri: white_logo}} />
          </>
        ),
        headerRight: (
          <DateRangePicker
            displayedDate={moment()}
            onChange={setDates}
            range
            moment={moment}
            backdropStyle={{
              top:-44,
              left:-screenWidth+40
            }}
          >
            <Icon type="AntDesign" name="calendar" style={{fontSize: 20, color: '#fff', marginRight:20 }}/>
          </DateRangePicker>
        ), 
        }
    },
    NewProcess: {
      screen: NewProcessScreen,
      navigationOptions: { 
        title: 'Yeni İş Emri'
      }
    },
  },
  {
    initialRouteName: 'SplashScreen',
    headerMode: 'float',
  }
)

export default createAppContainer(AuthStack)

import React，{useffect，useState}来自“React”；
从“反应导航”导入{createAppContainer、createStackNavigator、createSwitchNavigator}
从“react native”导入{Image，Button，Dimensions}
从“本机基”导入{Icon，DatePicker}；
从“App/Containers/Auth/AuthScreen”导入AuthScreen
从“应用程序/容器/仪表板/仪表板屏幕”导入仪表板屏幕
从“应用程序/容器/深度链接/深度链接屏幕”导入深度链接屏幕
从“应用程序/容器/飞溅屏幕/飞溅屏幕”导入飞溅屏幕
从“App/Containers/Process/NewProcessScreen”导入NewProcessScreen
从'App/Config'导入{Config}
从“react native daterange picker”导入daterange picker；
从“时刻/分钟/地点时刻”导入时刻；
现场时刻（“tr”）；
const screenWidth=维度.get（“窗口”）.width；
const screenWHeight=尺寸。获取（“窗口”）。高度；
/**
*根屏幕包含应用程序的导航。
*
*@见https://reactnavigation.org/docs/en/hello-react-navigation.html#creating-a-stack-navigator
*/
const uri=Config.LOGO\u URL；
const white_logo=Config.logo_white；
const AuthStack=createStackNavigator(
{
SplashScreen:SplashScreen，
认证：{
屏幕：AuthScreen，
导航选项：{
标题：null，
},
},
仪表板：{
屏幕：仪表板屏幕，
导航选项：{
头型：{
背景颜色：“#3b7a99”，
阴影颜色：“透明”，
阴影半径：0，
阴影偏移：{
高度:0,，
}
},
标题：(
),
头灯：(
), 
}
},
新流程：{
屏幕：NewProcessScreen，
导航选项：{
标题：“耶尼埃姆里”
}
},
},
{
initialRouteName:“SplashScreen”，
headerMode:'浮动'，
}
)
导出默认createAppContainer（AuthStack）

RootScreen.js

import React, { useEffect } from 'react'
import NavigationService from 'App/Services/NavigationService'
import AppNavigator from 'App/Navigators/AppNavigator'
import { View } from 'react-native'
import StartupActions from 'App/Stores/Startup/Actions'
import { Helpers } from 'App/Theme'
import { useDispatch } from 'react-redux'
import { Root } from "native-base";

const RootScreen = () => {
  // Deep linking prefix
  const prefix = 'lastsisapp://';
  
  const dispatch = useDispatch()

  useEffect(() => {
    dispatch(StartupActions.startup())
  }, [])

  const signOut = event => {
    console.log('does it work?');
    console.log(event);
  };

  return (
    <Root>
    <View style={Helpers.fill}>
      <AppNavigator
        // Initialize the NavigationService (see https://reactnavigation.org/docs/en/navigating-without-navigation-prop.html)
        ref={(navigatorRef) => {
          console.log('ne bu');
          console.log(navigatorRef);
          NavigationService.setTopLevelNavigator(navigatorRef)
        }}
        uriPrefix={prefix}
        screenProps={{signOut: signOut}}
      />
    </View>
    </Root>
  )
}

export default RootScreen

import React，{useffect}来自“React”
从“应用程序/服务/导航服务”导入导航服务
从“App/Navigators/AppNavigator”导入AppNavigator
从“react native”导入{View}
从“应用程序/商店/启动/操作”导入启动操作
从“应用程序/主题”导入{Helpers}
从“react redux”导入{useDispatch}
从“本机基”导入{Root}；
常量根屏幕=（）=>{
//深度链接前缀
常量前缀='lastsisapp://'；
const dispatch=usedpatch（）
useffect（（）=>{
分派（StartupActions.startup（））
}, [])
const signOut=事件=>{
log（'它工作吗？'）；
console.log（事件）；
};
返回(
{
控制台日志（'ne bu'）；
console.log（navigatorRef）；
NavigationService.setTopLevelNavigator（navigatorRef）
}}
uriPrefix={prefix}
screenProps={{signOut:signOut}
/>
)
}
导出默认根屏幕