Estaba aprendiendo ReactJS aquí: https://egghead.io/lessons/react-dynamically-generated-components y encontré este fragmento de código:
componentWillMount(){ fetch( 'http://swapi.co/api/people/?format=json') .then( response => response.json() ) .then( ({results: items}) => this.setState({items}) ) } ¿Qué significa la parte ({results: items}) de la función de flecha?
He visto la función de flecha
()=>console.log('hi')word=>console.log(word)(one, two)=>console.log(one)Pero nunca un objeto literal de esta manera.
Además, ¿por qué this.setState({items}) necesita llaves alrededor de items ? Que significa todo esto?
this.setState({items})es la abreviatura ES6 para
this.setState({items: items})y
({results: items})básicamente acepta un objeto como parámetro con la propiedad denominada resultados, y en el cuerpo de la función esto se asigna a elementos
ejecute a través de un transpilador, por ejemplo, babel, pruébelo, repita la página de su código
fetch( 'http://swapi.co/api/people/?format=json') .then( response => response.json() ) .then( ({results: items}) => this.setState({items}) )se convierte
var _this = this; fetch('http://swapi.co/api/people/?format=json') .then(function (response) { return response.json(); }) .then(function (_ref) { var items = _ref.results; return _this.setState({ items: items }); });Recomendaría mantener un enlace a esa página de babel: si algún código ES6 lo confunde, péguelo allí para ver cuál es la versión ES5: p ese es mi truco