Question

我正在尝试使用react-i18next将国际化实施到react本机项目中。 Link。我以HOC方式作为参考，因为我的react native无法与钩子功能兼容。

在这一切之上，我的项目正在使用Typescript，它给出了一个奇怪的错误，我能够理解但无法修复。很难找到足够好的打字稿资源，您无法充分理解实际项目的工作。这是我正在使用的代码：

class HomePage extends React.Component<IHomePage, IHomePageState> {
    public constructor(props: IHomePage) {
        super(props)
        this.state = {
            didBlurSubscription: null,
        }
    }

    public componentDidMount() {
        console.log('componentDidMount triggered')
        const didBlurSubscription = this.props.navigation.addListener(
            'didBlur',
            (payload: any) => {
                console.debug('didBlur', payload)
            }
        )
        this.setState({
            didBlurSubscription,
        })
    }

    public componentWillUnmount() {
        const { didBlurSubscription } = this.state
        // didBlurSubscription.remove();
    }

    public renderItem({ item }: { item: any }) {
        console.log('item ==> ', item)
        return <ProductCard url={item.imageUrl} />
    }

    // unc: (num: number) => string = String;
    public keyExtractor = (item: Idata, index: number): string => index.toString()

    public render() {
        return (
            <ScrollView>
                <View style={styles.container}>
                    {/* <ProductCard url={"https://gdurl.com/XCB2"}/> */}
                    {/* <Slider
          renderItem={this.renderItem}
          data={data}
          keyExtractor={this.keyExtractor}
          horizontal
        /> */}
                    <SectionContainer />
                    <SectionContainer />
                    <SectionContainer />
                    {/* <Button
          title="Go to Details... again"
          onPress={() => this.props.navigation.navigate('Details')}
          //onPress={() => this.props.navigation.push('Details')} // to add new route dynamically
        />
        <Button
          title="Go to Home"
          onPress={() => this.props.navigation.navigate('Home')}
        />
        <Button
          title="Go back"
          onPress={() => this.props.navigation.goBack()}
        /> */}
                </View>
            </ScrollView>
        )
    }
}
export default withTranslation()(HomePage)

我得到的typecript错误是这个。

注意：此错误显示在我尝试为组件添加HOC的最后一行。这是道具和状态的定义

interface IHomePage {
    navigation?: any
    [propName: string]: any
}

interface IHomePageState {
    didBlurSubscription: any
}

在本机中带有打字稿的Hoc（高阶组件）

0 个答案: