報道作出反應的錯誤esLinter

Question

我有代碼：

render() { 
    const self = this; 
//error on this line  const options = self.props.options.map(function (option) { 
    return (
     <option 
     key={option[self.props.optionValue]} 
     value={option[self.props.optionValue]} 
    > 
     {option[self.props.optionLabel]} 
    </option> 
); 
}); 
return (
    <DropDownSimpleStyled 
    closeStatus={this.state.closeStatus} 
    value={this.getValue} 
    onChange={this.handleChange} 
    onClick={this.changeCloseStatus} 
    > 
    {options} 
    </DropDownSimpleStyled>); 

}

我得到錯誤：

消息：「意外的函數表達式。 （prefer-arrow-callback）'

message：'Missing function expression name。 （FUNC-名稱）」

來源： 'eslint'

是什麼意思？我應該如何重新編寫符合eslinter的代碼？我錯過了什麼 ？

Answer 1

身高箭頭符號：http://eslint.org/docs/rules/prefer-arrow-callback

const options = self.props.options.map(function (option) { 
    [...] 
}); 

被替換爲：

const options = self.props.options.map((option) => { 
    [...] 
}); 

或處理單個語句時（注意隱含return）：

const options = self.props.options.map(option => (
    <option 
    key={option[self.props.optionValue]} 
    value={option[self.props.optionValue]} 
    > 
    {option[self.props.optionLabel]} 
    </option> 
)); 

更關於箭頭函數符號best pra的深入解釋ctices：https://github.com/airbnb/javascript#arrow-functions

它會解決這兩個問題，因爲箭頭函數總是匿名的。

http://eslint.org/docs/rules/func-names要求你命名你的函數，所以你不得不命名爲function(option) {}，比如函數function mapOptions(option) {}。這兩種符號（箭頭函數和命名函數）都應該被接受，具體取決於您的規則集。