将参数传递给typescript箭头函数

Question

在我的反应应用程序中，我有一个包含一组字符串项的状态。 我可以使用下面的代码成功地使这个项目成为HTML：

renderList(){  
     return this.props.books.map((book)=>{ 

      return(
      <li key={book.title} onClick={()=>{this.props.selectedBook(book)}}> 
        {book.title} 
      </li>); 
      }); 
} 

，但是当我改变功能(book)=>{this.props.selectedBook(book)} 然后它的selectedBook函数里面抱怨说book是undefined。

，所以我徘徊是什么

()=>{this.props.selectedBook(book)} //book is shown with no problem 

和

(book)=>{this.props.selectedBook(book)} //book is undefined

对我来说，他们两人都是在第一个版本一样，我得到的那本书已经是之间的区别可用在我的组件中，但在第二个我只是将它作为参数传递。所以为什么我把书作为第二个未定义的书？

更新：

的selectedBook是一个行动的创建者所以一旦它收到了一本书，它使一个动作吧。

export default function(book){ 
    console.log(book); 
    return({ 
    type:'Selected_Book', 
    payload:book 
    }); 
} 

Answer 1

你开始进入范围的变幻莫测。

当您在函数定义中将book对象定义为(book) =>时，您将该引用放在范围内。没有它，book引用实际上来自this.props.books.map((book)=>，因此函数接收到有效的book引用。

我觉得奇怪的是，你没有得到通过selectedBook方法的事件，但我不能进一步评论没有看到源（更新你的问题，如果这对你很重要）。