时间戳

首页 > 解决方案 > TypeScript + React Native 中的状态接口属性

typescript - TypeScript + React Native 中的状态接口属性

问题描述

我正在将 JavaScript 中的现有代码重写为 TypeScript。但是，我是 React Native 的新手。我的问题是：

我有一个自Component定义State界面的自定义。State我想通过自定义界面来解决我现在在组件本身内部遇到的错误。这是我的接口代码：

interface MeterReadingStaticState {
  process: any,
  selected: {
    value: any,
    isAccepted: boolean,
    type: any,
  },
  isLoaded: boolean,
}

这是我的内容Component：

export default class MeterReadingStatic extends Component<
    MeterReadingStaticProps, MeterReadingStaticState> {
  state: MeterReadingStaticState = {
    selected: {
    value: '',
    isAccepted: false,
    type: '',
  },
    process: [],
    isLoaded: false
  };

onAcceptPress = () => {
    const updatedProcess = this._updateObj('isAccepted', true);
    this.setState({ process: updatedProcess });
  };

_updateObj = (prop: MeterReadingStaticProps, value: any) => {
    const { process, selected } = this.state;
    const target = process.filter(
      item => item.name === selected.name && item.type === selected.type
    )[0];
    target[prop] = value;

    const updatedProcess = process.map(
      item =>
        item.name === target.name && item.type === target.type ? target : item
    );

    return updatedProcess;
  };

从上面的代码可以看出，我想访问状态属性的具体参数。但是，当我尝试这样做时，我遇到了一堆错误。当我尝试初始化 myState和尝试运行时_updateObj，我也会遇到一些错误onAcceptPress。

在定义State. 有什么解决方案吗？

标签： typescriptreact-native

解决方案

首先，我可以问一下你的 MeterReadingStaticState 是否在你班级的同一个文件中？

其次，你能看到你的 package.json 文件并确保你的 typescript 安装正确吗？

让我知道，因为它可能有助于解决问题

推荐阅读