ESLint: elements with click handlers must have at least one keyboard listener.

阅读更多

ESLint: Visible, non-interactive elements with click handlers must have at least one keyboard listener. (jsx-a11y/click-events-have-key)

 

由于ESLint检查强制非Button的 onClick 事件需要至少一个键盘事件。

键盘事件：

onKeyUp, onKeyDown, onKeyPress

 

 {}} onKeyDown={this.handleKeyDown} />
 {}} onKeyUp={this.handleKeyUp} />
 {}} onKeyPress={this.handleKeyPress} />

 

For GitHub：https://github.com/evcohen/eslint-plugin-jsx-a11y/blob/master/docs/rules/click-events-have-key-events.md

 

 

WARNING:

ESLint: Static HTML elements with event handlers require a role. (jsx-a11y/no-static-element-interactions

 

Fixed:

 

 {}} onKeyDown={this.handleKeyDown} />

 

 

WARNING:

ESLint: Elements with the 'button' interactive role must be focusable. (jsx-a11y/interactive-supports-focus)

 

Fixed:

 

 {}} onKeyDown={this.handleKeyDown} />

 

 

WARNING:

ESLint: Missing parentheses around multilines JSX (react/jsx-wrap-multilines)

 

Final Fixed:

 

{
  midBoxInfo.icons.map((v, i) => (
     this.goLink(v.link)}
      onKeyPress={() => this.goLink(v.link)}
    >
      
    
  ))
}