если операторы else не работают внутри плоского рендеринга React-Native - PullRequest
0 голосов
/ 14 апреля 2020

Привет, я пытаюсь реализовать кнопку Like для моего android приложения, используя React_native, я делаю это, используя условие if-else

if (id== user_id && status=='like') {
  alert( 'output-1' );
} else if (id== user_id && status=='unlike') {
  alert( 'output-2' );
} else if(id== user_id && status==null) {
  alert( 'output-3' );
} else if(id== null && status==null) {
  alert( 'output-4' );
} else {
  alert( 'output-5' );
}


Я использую вышеуказанные условия внутри flatlist, но если -также условия не работают должным образом, они отображают два выхода одновременно, например (выход-1 и выход-5) или (выход-2 и выход-5), я получаю эти ошибки, поэтому помогите мне решить их,


render() {
  const { userId, user_Posts, profile_Posts_like_Count_Array, profile_Posts_unlike_Count_Array, profile_Posts_like_Status_Array, profile_Posts_Comment_Count_Array, profile_Posts_Saved_Posts_Status_Array } = this.state
  return user_Posts.length > 0 ? (
    <View style={styles.container} onLayout={() => this.get_Id()}>


      <View style={styles.tabContent}>
        {this.state.userId != null ?
          <FlatList style={styles.list}
            data={this.state.user_Posts}
            keyExtractor={(data_Posts, index) => {
              return data_Posts.id.toString();
            }}
            ItemSeparatorComponent={() => { return (<View style={styles.separator} />) }}

            refreshing={this.state.isRefreshing}
            // onRefresh={this.getUserPostsFiles}
            onRefresh={this.handleRefresh}

            renderItem={(data, index) => {
              const items = data.item;

              const like_Count_Array = profile_Posts_like_Count_Array.filter((like_Array) => like_Array.post_id == items.id)
              const profile_Posts_like_Status = profile_Posts_like_Status_Array.filter((profile_Posts_Array) => profile_Posts_Array.id == items.id)



              return (
                <View style={styles.card}>
                  <View style={styles.cardHeader}>
                    <View style={[styles.headerContainer]}>
                      <View style={{ width: 100, margin: 4, backgroundColor: "transparent" }}>
                        <TouchableOpacity onPress={() => this.props.navigation.navigate('UsersProfile', { myparam: items.user_id })} >
                          <Image style={styles.cardProfilePic} source={{ uri: "https://howtags.com/profilepic/" + items.picture_url }} />
                        </TouchableOpacity>
                      </View>

                    </View>

                  </View>




                  {/*  *********************************  Card footer ******************* */}

                  <View style={styles.cardFooter}>
                    <View style={styles.socialBarContainer}>

                      {/* {profile_Posts_Comment_Count_Array.map((comment_Count) => <Text style={styles.socialCount} > {comment_Count.post_id} {comment_Count.user_id}</Text>)} */}
                      {/* {profile_Posts_like_Status.map((saved_like_Status) => <Text style={styles.socialCount} > {saved_like_Status.post_id} {saved_like_Status.like_status}</Text>)} */}
                      {/* {profile_Posts_like_Status_Array.map((Posts_Status) => <Text style={styles.socialCount}>{Posts_Status.post_id} {Posts_Status.like_status}</Text>)} */}

                      {
                        // profile_Posts_like_Status.id != null ? (
                        profile_Posts_like_Status.map((profile_like_Status) => {
                          // console.log('Saved Posts Screen:  like Status Button ', saved_like_Status)
                          if (profile_like_Status.likes_user_id == userId && profile_like_Status.like_status == 'like') {
                            return (
                              <View style={styles.socialBarSection}>
                                <TouchableOpacity style={styles.socialBarButton} onPress={() => { this.submit_like_Button(profile_like_Status.id) }}>
                                  <Icon name="thumbs-up" size={18} color="#66ff00" />
                                  {/* <Text style={styles.socialCount}>78 {profile_like_Status.id}{items.id}</Text> */}
                                  {
                                    like_Count_Array.map((like_Ct) => <Text style={styles.socialCount}>{like_Ct.likeCountProfilePosts}</Text>)
                                  }
                                </TouchableOpacity>
                              </View>
                            )
                          }
                          else if (profile_like_Status.likes_user_id == userId && profile_like_Status.like_status == 'unlike') {
                            return (
                              <View style={styles.socialBarSection}>
                                <TouchableOpacity style={styles.socialBarButton} onPress={() => { this.submit_like_Button(profile_like_Status.id) }}>
                                  <Icon name="thumbs-up" size={18} color="#ffffff" />
                                  {/* <Text style={styles.socialCount}>78{all_like_Status.id}</Text> */}
                                  {
                                    like_Count_Array.map((like_Ct) => <Text style={styles.socialCount}>{like_Ct.likeCountProfilePosts}</Text>)
                                  }
                                </TouchableOpacity>
                              </View>
                            )
                          } else if (profile_like_Status.likes_user_id == userId && profile_like_Status.like_status == null) {
                            return (
                              <View style={styles.socialBarSection}>
                                <TouchableOpacity style={styles.socialBarButton} onPress={() => { this.submit_like_Button(profile_like_Status.id) }}>
                                  <Icon name="thumbs-up" size={18} color="#ffffff" />
                                  {/* <Text style={styles.socialCount}>78{all_like_Status.id}</Text> */}
                                  {
                                    like_Count_Array.map((like_Ct) => <Text style={styles.socialCount}>{like_Ct.likeCountProfilePosts}</Text>)
                                  }
                                </TouchableOpacity>
                              </View>
                            )
                          } else if (profile_like_Status.likes_user_id == null && profile_like_Status.like_status == null) {
                            return (
                              <View style={styles.socialBarSection}>
                                <TouchableOpacity style={styles.socialBarButton} onPress={() => { this.submit_like_Button(profile_like_Status.id) }}>
                                  <Icon name="thumbs-up" size={18} color="#ffffff" />
                                  {/* <Text style={styles.socialCount}>78{all_like_Status.id}</Text> */}
                                  {
                                    like_Count_Array.map((like_Ct) => <Text style={styles.socialCount}>{like_Ct.likeCountProfilePosts}</Text>)
                                  }
                                </TouchableOpacity>
                              </View>
                            )
                          }
                          else {
                            return (
                              <View style={styles.socialBarSection}>
                                <TouchableOpacity style={styles.socialBarButton} onPress={() => { this.submit_like_Button(profile_like_Status.id) }}>
                                  <Icon name="thumbs-up" size={18} color="#ffffff" />
                                  {/* <Text style={styles.socialCount}>78 {all_like_Status.id}</Text> */}
                                  {
                                    like_Count_Array.map((like_Ct) => <Text style={styles.socialCount}>{like_Ct.likeCountProfilePosts}6</Text>)
                                  }
                                </TouchableOpacity>
                              </View>
                            )
                          }

                        })


                      }




                    </View>
                          )
                      }}
                  />
                  // {/* Flatlist Ends*/}
                  :

                  <View style={styles.ifContainer}>
                      <TouchableOpacity style={[styles.buttonContainer, styles.greenButton]} onPress={() => this.props.navigation.navigate('LogIn')}>
                        <Text style={styles.buttonText}>LogIn</Text>
                      </TouchableOpacity>

                      <TouchableOpacity style={[styles.buttonContainer, styles.blueButton]} onPress={() => this.props.navigation.navigate('Register')}>
                        <Text style={styles.buttonText}>Register</Text>
                      </TouchableOpacity>
                    </View>

              }


          </View>
                </View>
              ) : (
            <Modal
              transparent={true}
              animationType={'none'}
              visible={this.state.isLoading}
              style={{ zIndex: 1100 }}
              onRequestClose={() => { }}>
              <View style={styles.modalBackground}>
                <View style={styles.activityIndicatorWrapper}>
                  <ActivityIndicator animating={this.state.loading}
                    // color={Colors.primary}
                    size="large" color="#66ff00 "
                  />


                </View>
              </View>
            </Modal>
          )
        }
}

Однажды проверив мой код колонтитула, вы можете найти условие if-else, если кто-нибудь обнаружит какую-либо ошибку, пожалуйста, дайте мне знать решение для ошибок


Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...