意外令牌，预期，错误 (React-navigation)

Question

如果收到 outfitDetail 道具，我将在 Header 标题处呈现用户图像和用户名。

class OutfitDetail extends Component {
  static navigationOptions = ({navigation, screenProps}) => ({
    ...
    headerTitle: (
      !!screenProps.outfitDetail ? (
            <View style={styles.container}>
              <TouchableOpacity onPress={() => this.props.navigation.navigate('Profile', {id: userId})}>
                {this._renderAvatar(screenProps.outfitDetail.user.image)}
              </TouchableOpacity>
              <View style={styles.content}>
                <View style={styles.contentHeader}>
                  <RkText rkType='header5'>{screenProps.outfitDetail.user.username}</RkText>
                  <RkText rkType='secondary4 hintColor'>
                    <TimeAgo time={screenProps.outfitDetail.publish}/>
                  </RkText>
                </View>
                <RkText rkType='primary3 mediumLine'>{screenProps.outfitDetail.content}</RkText>
              </View>
            </View>
      ): (<Text>Loading</Text>)
    ),
    ...
  });

因此，如果 screenProps.outfitDetail 不为空（尚未获取），则呈现加载中，否则呈现用户的照片和用户名。

为什么我得到 Unexpected token, expected , error (React-navigation)？错误发生在上面的第三行代码。

Answer 1

static navigationOptions = ({navigation, screenProps}) => ({
headerTitle: (
    !!screenProps.outfitDetail ? (
        <View style={styles.container}>
          <TouchableOpacity onPress={() => this.props.navigation.navigate('Profile', {id: userId})}>
            {this._renderAvatar(screenProps.outfitDetail.user.image)}
          </TouchableOpacity>
          <View style={styles.content}>
            <View style={styles.contentHeader}>
              <RkText rkType='header5'>{screenProps.outfitDetail.user.username}</RkText>
              <RkText rkType='secondary4 hintColor'>
                <TimeAgo time={screenProps.outfitDetail.publish}/>
              </RkText>
            </View>
            <RkText rkType='primary3 mediumLine'>{screenProps.outfitDetail.content}</RkText>
          </View>
        </View>
  ):(<Text>Loading</Text>)
),
... other functions ...
})

意外令牌，预期，错误 (React-navigation)

Unexpected token, expected , error (React-navigation)

reactjs

react-native

react-redux

react-navigation