Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- import React, { Component } from 'react';
- class List extends Component {
- constructor() {
- super();
- this.state = { items: [1, 2] };
- this.newItem = undefined;
- }
- changeNewItem = e => {
- this.newItem = e.target.value;
- console.log(this.newItem);
- };
- addItem = e => {
- if (e.keyCode !== 13) return;
- var tmp_list = this.state.items;
- tmp_list.push(this.newItem);
- this.setState({ items: tmp_list }, () => {
- this.newItem = '';
- });
- };
- render() {
- return (
- <div>
- <ul>
- {this.state.items.map(item => (
- <li key={item}>{item}</li>
- ))}
- </ul>
- <input
- type="text"
- placeholder="add item"
- value={this.newItem}
- onChange={this.changeNewItem}
- onKeyUp={this.addItem}
- />
- </div>
- );
- }
- }
- export default List;
- import React, { Component } from 'react';
- class List extends Component {
- constructor() {
- super();
- this.state = { items: [1, 2], newItem: '' };
- }
- changeNewItem = e => {
- this.setState({newItem: e.target.value})
- };
- addItem = e => {
- if (e.keyCode !== 13) return;
- var tmp_list = this.state.items;
- tmp_list.push(this.state.newItem);
- this.setState({ items: tmp_list }, () => {
- this.state.newItem = '';
- });
- };
- render() {
- return (
- <div>
- <ul>
- {this.state.items.map(item => (
- <li key={item}>{item}</li>
- ))}
- </ul>
- <input
- type="text"
- placeholder="add item"
- value={this.state.newItem}
- onChange={this.changeNewItem}
- onKeyUp={this.addItem}
- />
- </div>
- );
- }
- }
- export default List;
Add Comment
Please, Sign In to add comment