흐름(원어민 반응)에서 'this.state' 사용에 대한 오류가 표시됨

흐름(원어민 반응)에서 'this.state' 사용에 대한 오류가 표시됨

를 사용하려고 할 때마다 다음 오류가 발생합니다.this.state내 코드:

오브젝트 리터럴:이 유형은 정의되지 않은 유형과 호환되지 않습니다.형식 매개 변수를 선언하는 것을 잊으셨습니까?State식별자의Component?:

다음은 문제를 일으키는 코드입니다(다른 곳에서도 발생합니다).

class ExpandingCell extends Component {
    constructor(props) {
    super(props);
    this.state = {
        isExpanded: false
    };
}

어떤 도움이라도 주시면 감사하겠습니다 =)

사용하려면 상태 속성의 유형을 정의해야 합니다.

class ComponentA extends Component {
    state: {
        isExpanded: Boolean
    };
    constructor(props) {
        super(props);
        this.state = {
            isExpanded: false
        };
    }
}

플로우를 사용하고 있으며,this.state컴포넌트의constructor:

---

1. 작성type위해서this.state

type State = { width: number, height: number }

2. 이것으로 컴포넌트를 초기화합니다.type

export default class MyComponent extends Component<Props, State> { ... }

3. 이제 설정할 수 있습니다.this.state흐름 오류 없이

  constructor(props: any) {
    super(props)
    this.state = { width: 0, height: 0 }
  }

---

다음 예시는 를 갱신하는 보다 완전한 예입니다.this.state컴포넌트의 폭과 높이를 사용하여onLayout호출됩니다.

// @flow

import React, {Component} from 'react'
import {View} from 'react-native'

type Props = {
  someNumber: number,
  someBool: boolean,
  someFxn: () => any,
}

type State = {
  width: number,
  height: number,
}

export default class MyComponent extends Component<Props, State> {

  constructor(props: any) {
    super(props)

    this.state = {
      width: 0,
      height: 0,
    }
  }

  render() {

    const onLayout = (event) => {
      const {x, y, width, height} = event.nativeEvent.layout
      this.setState({
        ...this.state,
        width: width,
        width: height,
      })
    }

    return (
      <View style={styles.container} onLayout={onLayout}>

        ...

      </View>
    )
  }
}

const styles = StyleSheet.create({
  container: {
    display: 'flex',
    flexDirection: 'column',
    justifyContent: 'center',
    alignItems: 'center',
  },
})

흐름 유형으로 상태를 무시할 수 있습니다.:any단, 이는 권장되지 않습니다.당신의 상태가 더 커지고 복잡해지면 길을 잃게 될 것이다.

class ExpandingCell extends Component {

    state: any;

    constructor(props) {
        super(props);
        this.state = {
            isExpanded: false
        };
    }
}

삭제하다/* @flow */in your code flite top

언급URL : https://stackoverflow.com/questions/36860349/flow-react-native-is-giving-me-errors-for-using-this-state