Kann die Syntax von Params nicht verstehen

Question

Ich kann Params Syntax nicht verstehen. Was bedeutet (todo, destroyTodo) in diesem Fall eigentlich? Warum können wir nicht einfach "Requisiten" als Param verwenden?

const TodoItem = ({todo, destroyTodo}) => { 
    return (
    <div> 
     {todo.text} 
     <span onClick={destroyTodo}> x </span> 
    </div> 
) 
} 

Answer 1

Der Code, den Sie angezeigt haben, erstellt eine neue Komponente mit einer JavaScript-Funktion. Die {todo,destroyTodo} ist ein JSON-Objekt, das als props an die Komponente übergeben und in 2 Variablen namens todo und destroyTodo destrukturiert wird. Es ist eine Abkürzung für

const TodoItem = (props) => { 
    const {todo, destroyTodo} = props; 
    return (
    <div> 
     {todo.text} 
     <span onClick={destroyTodo}> x </span> 
    </div> 
) 
} 

Die gleiche Komponente wie eine Klasse erstellt tatsächlich wäre

class TodoItem extends React.Component{ 

render(){ 
    return (
    <div> 
     {this.props.todo.text} 
     <span onClick={this.props.destroyTodo}> x </span> 
    </div> 
) 
} 
} 

Answer 2

Sie Ihre Requisiten passieren Objekt aber in dem Fall, wenn Sie tun <TodoItem {...props}/> passieren Sie alle Requisiten aus ein Elternteil und muss darauf hinweisen, wie

const TodoItem = (props) => { 
    return (
    <div> 
     {props.todo.text} 
     <span onClick={props.destroyTodo}> x </span> 
    </div> 
) 
}