如何导出在名称空间中要在其他模块中使用的Typescript接口?

时间:2019-05-31 05:11:12

标签: reactjs typescript interface namespaces typescript-typings

我有这样的界面; x.ts

 namespace Basex {
    export interface AddressDto  {
        AddressDetail?: string;
        AddressName?: string;
        AddressType?: number;
        City?: string;
        CityCode?: number;
        CountryCode?: number;
        DexjustizCode?: string;
        District?: string;
        HouseNumber?: number;
        HouseNumberDetail?: string;
        Id?: number;
        IsMainAddress?: boolean;
        LastAddressInterval?: string;
        Street?: string;
        Text?: string;
        Town?: string;
        ValidationLevel?: number;
        ValidityEndDate?: Date;
        ValidityStartDate?: Date;
     }  
}

I use this object in my screen in this way;

const {Basex}  = require('../../src/model/dto/x');

我可以像这样AddressDto访问Basex.AddressDto

但是我无法从另一个依赖项目访问此名称空间。我尝试使用上述方法导出依赖项项目的index.ts。但是事实并非如此。很快,如何从另一个依赖项访问此名称空间的接口?

2 个答案:

答案 0 :(得分:1)

您必须导出界面。请参阅here

答案 1 :(得分:0)

您还可以在所需位置导入接口模块,然后从那里将其作为道具传递,我认为这将是一种便捷的方法

例如: button.props.ts

import { ViewStyle, TextStyle, TouchableOpacityProps } from "react-native"
import { ButtonPresetNames } from "./button.presets"

export interface ButtonProps extends TouchableOpacityProps {
  /**
   * Text which is looked up via i18n.
   */
  tx?: string

  /**
   * The text to display if not using `tx` or nested components.
   */
  text?: string

  /**
   * An optional style override useful for padding & margin.
   */
  style?: ViewStyle | ViewStyle[]

  /**
   * An optional style override useful for the button text.
   */
  textStyle?: TextStyle | TextStyle[]

  /**
   * One of the different types of text presets.
   */
  preset?: ButtonPresetNames

  /**
   * One of the different types of text presets.
   */
  children?: React.ReactNode
}

内部按钮。tsx将其作为道具传递

import * as React from "react"
import { TouchableOpacity } from "react-native"
import { Text } from "../text"
import { viewPresets, textPresets } from "./button.presets"
import { ButtonProps } from "./button.props"
import { mergeAll, flatten } from "ramda"

/**
 * For your text displaying needs.
 *
 * This component is a HOC over the built-in React Native one.
 */
export function Button(props: ButtonProps) {
  // grab the props
  const { preset = "primary", tx, text, style: styleOverride, textStyle: textStyleOverride, children, ...rest } = props

  const viewStyle = mergeAll(flatten([viewPresets[preset] || viewPresets.primary, styleOverride]))
  const textStyle = mergeAll(flatten([textPresets[preset] || textPresets.primary, textStyleOverride]))

  const content = children || <Text tx={tx} text={text} style={textStyle} />

  return (
    <TouchableOpacity style={viewStyle} {...rest}>
      {content}
    </TouchableOpacity>
  )
}

在index.ts内部,只需导出button.tsx

export * from "./button"