sohobloo / react-native-modal-dropdown

A react-native dropdown/picker/selector component for both Android & iOS.
MIT License
1.19k stars 478 forks source link

fix onSelect return idx as string and not int #185

Open invyctus92 opened 6 years ago

invyctus92 commented 6 years ago

The method of ModalDropdown, onSelect, return value idx as string, not relation with value of defaultIndex that accepted value as number. I have solved, using parseInt

 <ModalDropdown
            ref={ref => (this.ref = ref)}
            style={{
              justifyContent: "center",
              alignItems: "center",
              flexDirection: "row"
            }}
            dropdownStyle={{
              height: Platform.OS == "android" ? 104 : 90,

              width: 180
            }}
            dropdownTextStyle={{
              fontSize: 15
            }}
            showsVerticalScrollIndicator={false}
            options={["Global", "City"]}
            defaultIndex={parseInt(this.state.index)}
            renderRow={(option, index, isSelected) =>
              index === this.state.index ? (
                <View
                  style={{
                    height: Platform.OS == "android" ? 52 : 45,
                    alignContent: "center",
                    alignItems: "center",
                    alignSelf: "center",
                    flexDirection: "row"
                  }}
                >
                  <Text
                    style={{
                      textAlignVertical: "center",
                      fontFamily: "OpenSans-Regular",
                      fontWeight: "400",
                      color: "#3D3D3D",
                      fontWeight: "bold"
                    }}
                  >
                    {option}
                  </Text>
                </View>
              ) : (
                <View
                  style={{
                    height: Platform.OS == "android" ? 52 : 45,
                    alignContent: "center",
                    alignItems: "center",
                    alignSelf: "center",
                    flexDirection: "row"
                  }}
                >
                  <Text
                    style={{
                      textAlignVertical: "center",
                      fontFamily: "OpenSans-Regular",
                      fontWeight: "400",
                      color: "#3D3D3D",
                      fontSize: 13
                    }}
                  >
                    {option}
                  </Text>
                </View>
              )
            }
            onSelect={(idx, value) => {
              this.setState({
                activeSelectable: value.toLowerCase(),
                index: idx
              });
              this.props.navigation.setParams({
                headerTitle: (
                  <Text
                    style={{
                      left: Platform.OS == "android" ? 20 : 0
                    }}
                  >
                    {value} Ranking
                  </Text>
                )
              });
            }}
          >
<View
              style={{
                flexDirection: "row",
                alignContent: "center",
                alignSelf: "center",
                alignItems: "center"
              }}
            >
              <OwnIcon name="standings_icn" size={35} color="#3D3D3D" />
              <Icon name="ios-arrow-down" size={10} color="#3D3D3D" />
            </View>
</ModalDropdown>