react-native - ReactNative および NativeBase ラジオ

Question

NativeBase テンプレートを使用して ReactNative アプリのラジオ値を変更しようとしました。ラジオをクリックした後、正確にチェックされているかどうかにかかわらず、ラジオから値を取得または設定したい。しかし、値を取得または設定する方法が見つかりませんでした。ラジオボタンでさえ、クリック後に画面上で変化しませんでした。コードは次のようになります。

import React, { Component } from 'react';
import { TouchableOpacity, Image, View } from 'react-native';
import { connect } from 'react-redux';
import { actions } from 'react-native-navigation-redux-helpers';
import {
  Container,
  Header,
  Title,
  Content,
  Text,
  Button,
  Icon,
  InputGroup,
  Input,
  List,
  ListItem,
  Radio,  } from 'native-base';

import { openDrawer } from '../../actions/drawer';
import { Col, Row, Grid } from 'react-native-easy-grid';
import styles from './styles';
import dimension from './global';
import Swiper from 'react-native-swiper';

const imgBoy = require('../../../images/icon_boy.png');
const imgGirl = require('../../../images/icon_girl.png');
const {
  popRoute,
} = actions;

class SessionPage extends Component {

  static propTypes = {
    name: React.PropTypes.string,
    index: React.PropTypes.number,
    list: React.PropTypes.arrayOf(React.PropTypes.string),
    openDrawer: React.PropTypes.func,
    popRoute: React.PropTypes.func,
    navigation: React.PropTypes.shape({
      key: React.PropTypes.string,
    }),
  }

  popRoute() {
    this.props.popRoute(this.props.navigation.key);
  }

  constructor(props) {
    super(props);
    // console.log(this.props.navigation);
    this.state = {
      sliderCount : parseInt(this.props.navigation.behavior.length / 5) + 1,
      sliderArray : [],
      selected : false,
    }
    this.getSliderArray();
    console.log(this.state);
  }

  getSliderArray() {
    for (var i = 0; i < this.state.sliderCount; i++) {
      var childArray = [];
      for (var j = i * 5; j < 5 * (i + 1); j++) {
        if (this.props.navigation.behavior[j] != null){
          var unit = this.props.navigation.behavior[j];
          unit.selected = true;
          childArray.push(unit);
        }
      }
      this.state.sliderArray.push({
        index : i,
        behaviors : childArray
      })
    }
  }

  selectRadio(i, j){
    this.state.sliderArray[i].behaviors[j].selected = true;
  }

  render() {
    const { props: { name, index, list } } = this;

    return (
      <Container style={styles.container}>            
          <Swiper style={styles.wrapper}
            height={dimension.Height - 400}
            width={dimension.Width - 40}
            showsButtons={false}
            showsPagination={true}>
            {this.state.sliderArray.map((item, i) =>
              <View style={styles.slide1} key={i}>
                  {item.behaviors.map((subitem, j) =>
                      <ListItem key={i + "-" + j} style={styles.cardradio}>
                            <Radio selected={this.state.sliderArray[i].behaviors[j].selected} onPress={() => this.selectRadio(i, j)} />
                            <Text>{subitem.behaviorName}</Text>
                      </ListItem>

                  )}
              </View>
            )}
          </Swiper>
        </Content>
      </Container>
    );
  }
}


function bindAction(dispatch) {
  return {
    openDrawer: () => dispatch(openDrawer()),
    popRoute: key => dispatch(popRoute(key)),
  };
}

const mapStateToProps = state => ({
  navigation: state.cardNavigation,
  name: state.user.name,
  index: state.list.selectedIndex,
  list: state.list.list,
});


export default connect(mapStateToProps, bindAction)(SessionPage);