eslint 与 airbnb 的反应

Question

使用 airbnb 出租

import React from 'react';
import TopBar from './topBar';
import Content from './content';

class App extends React.Component {
  render() {
    return (
      <div className="app">
        <TopBar />
        <Content />
      </div>
    );
  }
}

export default App;

报错

5:1  error  Component should be written as a pure function  react/prefer-stateless-function

我试过了

function render(){}

和

render: function() {}

但没有成功

Answer 1

使用 https://facebook.github.io/react/docs/reusable-components.html#stateless-functions 中的文档，您的代码示例将转换为：

import React from 'react';
import TopBar from './topBar';
import Content from './content';

function App (props) {
  return (
    <div className="app">
      <TopBar />
      <Content />
    </div>
  );
}

export default App;

请注意，此更新后的代码示例将违反一些其他的 airbnb eslinting 规则，但这些规则应该是不言自明的。只需将此作为模板发布即可。关于这个主题的文档非常直接，因此请务必给予好评。

eslint 与 airbnb 的反应

eslint react with airbnb

reactjs

eslint

eslint-config-airbnb