Как использовать `this` в реагирующем родном-складном аккордеонном компоненте? - PullRequest
0 голосов
/ 10 января 2019

У меня есть экран реакции-натива, где я хочу использовать компонент-аккордеон реагирования-родного-складного, чтобы показать список активов. В требуемой rendercontent опоре аккордеона я передаю функцию sellAsset, определенную внутри компонента экрана, где я использую ключевое слово this для ссылки на компонент экрана. Но это не сработало, всегда говорил мне this.sellAsset is not a function. Пожалуйста, смотрите код ниже.

Пробовал привязку некоторых функций, но не работал. Кажется, что this, переданный компоненту аккордеона, не указывает на компонент экрана.

Так как правильно назвать this.sellAsset?

renderContent(item) {
    return (
        <View style={[styles.imageContent]}>
          <View style={[styles.detailContainer, {paddingVertical: 0}]}>
            <Image source={getImage(_.get(item, ['Asset', 'image']))} resizeMode="contain" style={styles.assetImage}/>
          </View>
          <View style={styles.priceContainer}>
            <CustomSignInButton
                text="SELL"
                onPress={() => {this.sellAsset();}}
                buttonBackgroundColor="transparent"
                buttonBorderColor="white"
                buttonTextColor="white"
                buttonHeight={30}
            />
          </View>
        </View>
    );
  }

render() {
    return (
        <LinearGradient colors={[Colors.splashGradient.top, Colors.splashGradient.middle, Colors.splashGradient.bottom]}
                        style={{flex: 1}}>
          <View style={styles.container}>
            <IOSStatusBar backgroundColor="transparent"/>
            {this.state.transactionDetails !== null ?
                (this.state.transactionDetails.length > 0 &&
                    <Accordion sections={this.state.transactionDetails} renderHeader={this.renderHeader}
                               renderContent={this.renderContent} underlayColor={Colors.rowSeparatorBlue}
                    />
                ) : <View/>
            }
          </View>
        </LinearGradient>
    );
  }
}

1 Ответ

0 голосов
/ 10 января 2019

Если я правильно понимаю, sellAsset () - это метод для вашего компонента экрана?

У вас есть два варианта:

1. Привязать оба метода к этому

class YourScreen extends React.Component {

  constructor(props) {
    this.renderContent = this.renderContent.bind(this);
    this.sellAsset = this.sellAsset.bind(this);
  }

  sellAsset() { ... }

  renderContent() { ... }
}

2. Используйте функции стрелок

class YourScreen extends React.Component {

  sellAsset = () => { ... }

  renderContent = (item) => { ... }
}
...