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; 

eslinting反應給人

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但是這些規則應該是不言自明的。只需將其作爲要遵循的模板即可。關於這個主題的文檔非常直接，所以請確保您給出一個好的評論。