React-Native コンポーネント イベント

this.props.onXXXXX でイベントコール

CustomButton

this._onClick()}/>

import React, { Component } from 'react';
import {
  View,
  Alert,
} from 'react-native';

// Import native-base UI components
import {
    Button,
    Text,
} from 'native-base';

export default class CustomButton extends React.Component {
    constructor(props) {
      super(props);
      this.state = {
      };
    }

    render() {
      return (
        <View >
            <Button info onPress={this.props.onClick} ><Text>aaaaaa</Text></Button>
        </View>
      );
    }

  }

SlideSwitch

this._onClick()} value={this.state.enabled}/>

import React, { Component } from 'react';
import {
  View,
  Alert,
} from 'react-native';

// Import native-base UI components
import {
  Switch,
} from 'native-base';


import SettingsService from '../lib/SettingsService';


export default class SlideSwitch extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      enabled: false,
    };
    //settingsService
    this.settingsService = SettingsService.getInstance();
  }

  render() {
    return (
      <Switch onValueChange={() => this.onValueChange()} value={this.state.enabled} />
    );
  }

  onValueChange(value) {
    this.settingsService.playSound('BUTTON_CLICK');

    //status change
    let enabled = !this.state.enabled;
    this.setState({
      enabled: enabled
    });


    if (enabled) {

      Alert.alert( '', '記録を開始しますか？',
        [
          {text: 'No', onPress: () => {
            this.setState({
              enabled: false,
            });
          }, style: 'cancel'},
          {text: 'Yes', onPress: () => {
            this.onToggleEnabled(enabled);
          }
        },],{ cancelable: false }
      )

    } else {

    }

  }



  onToggleEnabled(enabled) {
    this.props.onValueChange(enabled);
  }

}