this.onPressItem 不是 map 中的函数

Question

我需要有关 react native 的帮助（使用过的打字稿）。 我映射状态，并调用调用 onpress 函数，但不工作。 我对此一无所知，我真的需要帮助。 00000000000000000000000000000000000000000000000000000000

错误

this.onPressItem is not a function

代码

import React, { Component } from 'react';
import ReactNative from 'react-native';
import { styles } from './labsoft/labsoft.ui';

const _ = require('lodash');
var _TabsScrollPage: any;
const tabbarTabsScroll = ReactNative.StyleSheet.flatten(styles.tabbarTabsScroll);
const labelTabsScroll = ReactNative.StyleSheet.flatten(styles.labelTabsScroll);
const spacingLabel = ReactNative.StyleSheet.flatten(styles.spacingLabelTabsScroll)
const spacingLabelActive = ReactNative.StyleSheet.flatten(styles.spacingLabelActiveTabsScroll)

export interface itemsTabsScrollProperties {
    app?: any; // this is required in view
    currentPage?: any;
    pages?: any
}

export interface itemsTabsScrollState {
    app?: any; // this is required in view
    currentPage?: any;
    pages?: any;
}


export default class ItemsTabsScrollPage extends Component<itemsTabsScrollProperties, itemsTabsScrollState> {

constructor(props: itemsTabsScrollProperties) {
    super(props);

    _TabsScrollPage = props.app;
    this.state = {
        currentPage: this.props.currentPage,
        pages: [
            { name: this.props.pages.name }
        ]
    }


}

get currentPage() { return this.state.currentPage }
set currentPage(value) { this.setState({ currentPage: value }) }

onPressItem(key: number) {
    console.log("key", key)
    this.setState({ currentPage: key })
    _TabsScrollPage.navigateTo();
}
private _current: any;

render() {
    this._current = this.state.currentPage
    console.log(this._current)
    return (
        <ReactNative.ScrollView horizontal={true} showsHorizontalScrollIndicator={false} decelerationRate="fast">
            <ReactNative.View style={tabbarTabsScroll}>
                {

                    this.props.pages.map(function (value: any, i: any) {
                        return (
                            <ReactNative.TouchableOpacity key={i} onPress={this.onPressItem(i)} style={this._current === i ? spacingLabelActive : spacingLabel}>
                                <ReactNative.Text style={labelTabsScroll}>{value.name}</ReactNative.Text>
                            </ReactNative.TouchableOpacity>)
                    })
                }

            </ReactNative.View>
        </ReactNative.ScrollView >

    );
}
}

Answer 1

使用箭头函数允许this 指向组件。变化：

this.props.pages.map(function (value: any, i: any) {

到

this.props.pages.map((value: any, i: any) => {