diff --git a/16-buttons/a-simple-button/src/App.js b/16-buttons/a-simple-button/src/App.js index 7a3aac4..f671ca5 100644 --- a/16-buttons/a-simple-button/src/App.js +++ b/16-buttons/a-simple-button/src/App.js @@ -1,19 +1,19 @@ import React, { Component } from 'react'; +import Button from './Button'; import './App.css'; class App extends Component { render () { return (
- +
); } handleAddUser = () => { // handle button click console.log('add user'); - } + }; } export default App; - diff --git a/16-buttons/a-simple-button/src/Button.js b/16-buttons/a-simple-button/src/Button.js new file mode 100644 index 0000000..adddabd --- /dev/null +++ b/16-buttons/a-simple-button/src/Button.js @@ -0,0 +1,3 @@ +import React from 'react'; + +export default props => ; diff --git a/16-buttons/d-segmented-button/src/SegmentedButton.js b/16-buttons/d-segmented-button/src/SegmentedButton.js index 082f8b9..acc63d0 100644 --- a/16-buttons/d-segmented-button/src/SegmentedButton.js +++ b/16-buttons/d-segmented-button/src/SegmentedButton.js @@ -46,21 +46,23 @@ class SegmentedButton extends Component { const { allowDepress } = this.props; const { target: btn } = e; const { tagName } = btn; - let { pressed } = this.state; + let pressedState = this.state.pressed.slice(0); if (tagName === 'BUTTON') { const { value } = btn; - const valIndex = pressed.indexOf(value); + const valIndex = pressedState.indexOf(value); const isPressed = valIndex !== -1; // toggle the "pressed" button state if (isPressed) { - if (allowDepress || (!allowDepress && pressed.length > 1)) { - pressed = pressed.filter(item => item !== value); + if (allowDepress || (!allowDepress && pressedState.length > 1)) { + pressedState = pressedState.filter(item => item !== value); } } else { - pressed = [...pressed, value]; + pressedState = [...pressedState, value]; } - this.setState({ pressed }); + this.setState({ + pressed: pressedState + }); } } }