代码之家  ›  专栏  ›  技术社区  ›  stkvtflw

如何要求参数?

  •  0
  • stkvtflw  · 技术社区  · 5 年前

    我已经创建了一个接口文件:

    import { CompositeNavigationProp } from '@react-navigation/native'
    import { MaterialBottomTabNavigationProp } from '@react-navigation/material-bottom-tabs'
    import { StackNavigationProp } from '@react-navigation/stack'
    
    export type ITabOneParams = {}
    export type ITabTwoParams = {}
    export type IStackOneParams = {
      headerTitle: string
      itemId: string
    }
    
    export type IHomeTabsParams = {
      TabOne: ITabOneParams
      TabTwo: ITabTwoParams
    }
    
    export type IHomeStackParams = {
      HomeTabs: IHomeTabsParams
      StackOne: IStackOneParams
    }
    
    export {
      MaterialBottomTabNavigationProp,
      StackNavigationProp,
      CompositeNavigationProp
    }
    

    下面是一个使用这些接口的组件:

    import React, { PureComponent } from 'react'
    import { StyleSheet, Text, View } from 'react-native'
    import { Button } from 'react-native-paper'
    import {
      CompositeNavigationProp,
      MaterialBottomTabNavigationProp,
      StackNavigationProp,
      IHomeStackParams,
      IHomeTabsParams
    } from '../../interfaces/router'
    
    export default class TabOne extends PureComponent<OwnProps> {
      render () {
        return (
          <View>
            <Text>TabOne</Text>
            <Button
              onPress={() => this.props.navigation.navigate('StackOne')}
            >
              Go to StackOne
            </Button>
          </View>
        )
      }
    }
    
    type TabOneScreenNavigationProp = CompositeNavigationProp<
      MaterialBottomTabNavigationProp<IHomeTabsParams, 'TabOne'>,
      StackNavigationProp<IHomeStackParams>
    >
    
    export interface OwnProps {
      navigation: TabOneScreenNavigationProp
    }
    

    this.props.navigation.navigate('StackOne') 抛出类型错误,因为根据我的类型定义 headerTitle itemId

    0 回复  |  直到 5 年前