从 ES6 箭头函数返回对象字面量

Question

如果有人解释为什么在 updatedPosts 中我们应该 return 一个对象并且在一个对象内部我们应该再次 return ，我将不胜感激？为什么我们可以只用代码代替 =>

const updatedPosts = posts.map(数据 => { ...数据，作者：'Leo' } )

class Blog extends Component {
    state = {
        post : []
    }
    componentDidMount(){
axios.get('https://jsonplaceholder.typicode.com/posts')
.then(response => {
    const posts = response.data.slice(0,3);
    const updatedPosts = posts.map(data =>{
        return {
            ...data,
            author : 'Leo'
        }

    })
    this.setState({post : updatedPosts})
    console.log(response)
})

Answer 1

这段代码const updatedPosts = posts.map(data => { ...data, author : 'Leo' } )实际上是可行的，但你必须在给你的对象周围加上括号

const updatedPosts = posts.map(data => ({ ...data, author : 'Leo' }))

您可以在本文档的返回对象文字部分找到解释https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

从 ES6 箭头函数返回对象字面量

Returning Object Literals from ES6 arrow function

return

ecmascript-6

arrow-functions