Question

我试图将标题，日期，时间作为参数传递给addtodo，并通过props传递给App.js。如何在一个函数参数中传递所有3个参数

export class AddTodo extends Component {
state = {
    title: '',
    date: '',
    time: ''
}
onChange = (e) => this.setState({[e.target.name]: e.target.value});
onSubmit = (e) => {
    e.preventDefault();
    this.props.addTodo(this.state.title);
    this.setState({title: ''});
    this.props.addTodo(this.state.date);
    this.setState({date: ''});
    this.props.addTodo(this.state.time);
    this.setState({time: ''});
    this.props.callTodo();
}

render() {
    return (
        <div>
            <form onSubmit={this.onSubmit}>
                <input type="text" name="title"
                       onChange{this.onChange} value{this.state.title} placeholder="Add 
             task"/>
                <input type="date" name="date" onChange={this.onChange} value=
                    {this.state.date}/>
                <input type="time" name="time" onChange={this.onChange} value=
                    {this.state.time}/>
                <input type="submit" value="submit"/>
            </form>
        </div>
    )
}
-------------------------------------------------------------------------

App.js

addTodo = (title) => {
const newTodo = {
    id: uuid.v4(),
    title,
    completed: false
}
this.setState({todos: [...this.state.todos, newTodo]});

}

错误- ./src/App.js 第53行：“ title”未定义no-undef 第54行：“ date”未定义no-undef 第55行：“时间”未定义no-undef 第62行：“ newTodo”未定义为no-undef

Answer 1

您可以将其扩展为接受三个参数title，addTodo和{{1}，而不仅仅是将title的单个date接受到time }。

class AddTodo extends Component {
  // ...

  onSubmit = e => {
    const { title, date, time } = this.state;
    e.preventDefault();
    this.props.addTodo(title, date, time);
    this.setState({ title: "", date: "", time: "" });
    this.props.callTodo();
  };

  // ...
}

class App extends Component {
  // ...

  addTodo = (title, date, time) => {
    const newTodo = {
      id: uuid.v4(),
      title,
      date,
      time,
      completed: false
    };
    this.setState({ todos: [...this.state.todos, newTodo] });
  };

  // ...
}

如何在通过Props传递的函数中传递多个参数

1 个答案: