SearchResultInput.js 1.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748
  1. import React from 'react';
  2. import PropTypes from 'prop-types';
  3. export default class SearchResultInput extends React.Component {
  4. constructor(props) {
  5. super(props);
  6. this.state = {
  7. isChecked: false,
  8. }
  9. this.toggleCheckboxChange = this.toggleCheckboxChange.bind(this);
  10. }
  11. /**
  12. * checkbox の選択切り替えを行い、
  13. * 親コンポーネントに定義されたメソッドを呼び出します
  14. *
  15. * @memberof SearchResultInput
  16. */
  17. toggleCheckboxChange() {
  18. const { handleCheckboxChange, page } = this.props;
  19. this.setState(({ isChecked }) => (
  20. {
  21. isChecked: !isChecked,
  22. }
  23. ));
  24. this.props.handleCheckboxChange(page);
  25. }
  26. render() {
  27. let pageId = this.props.page.id;
  28. const { isChecked } = this.state;
  29. return (
  30. <input
  31. type="checkbox"
  32. value={pageId}
  33. checked={isChecked}
  34. onChange={this.toggleCheckboxChange} />
  35. );
  36. }
  37. }
  38. SearchResultInput.propTypes = {
  39. page: PropTypes.object.isRequired,
  40. handleCheckboxChange: PropTypes.func.isRequired,
  41. };