How To Map The Radio Button And Retrieve The Value Without Duplicates

I use the library react-native-flexi-radio-button, and get problems when using map ()

I have tried to fill the value of the map item ()

  _mapDuration() {
    if (this.props.childList) {
      return this.props.childList.map((item, i) => <RadioGroup
        size={24}
        thickness={1}
        color="#FF9F4D"
        highlightColor="#fff5ed"
        selectedIndex={null}
        onSelect={(index, value) =>
          this.onSelectService(index, value)
        }
        style={{ marginTop: 10 }}
      >
        <RadioButton
          value={item.duration}
          color="#FF9F4D"
          style={{ alignItems: 'center' }}
        >
          <View style={styles.line}>
            <View
              style={{
                flexDirection: 'row',
              }}
            >
              <Text style={styles.textChoice}>{item.duration} Menit</Text>
              <Text style={styles.textSubCOD}>
                {/* ( 1 jam ) */}
              </Text>
              <Text style={styles.textUang}> Rp {item.price} </Text>
            </View>
          </View>
        </RadioButton>
      </RadioGroup>

      )
    }
  }

I want to get value and the radio functions without duplicate radio buttons

Use the key value to resolve it. And add parentheses.

  _mapDuration() {
    if (this.props.childList) {
      return this.props.childList.map((item, i) => (<RadioGroup
        size={24}
        thickness={1}
        color="#FF9F4D"
        highlightColor="#fff5ed"
        selectedIndex={null}
        onSelect={(index, value) =>
          this.onSelectService(index, value)
        }
        style={{ marginTop: 10 }}
      >
        <RadioButton
          key={i}
          value={item.duration}
          color="#FF9F4D"
          style={{ alignItems: 'center' }}
        >
          <View style={styles.line}>
            <View
              style={{
                flexDirection: 'row',
              }}
            >
              <Text style={styles.textChoice}>{item.duration} Menit</Text>
              <Text style={styles.textSubCOD}>
                {/* ( 1 jam ) */}
              </Text>
              <Text style={styles.textUang}> Rp {item.price} </Text>
            </View>
          </View>
        </RadioButton>
      </RadioGroup>)

      )
    }
  }