は、CompoNetを純粋な関数としてここで

Question

を記述する必要がありますリアクト私ReactJsコンポーネントのコードです：

import React from 'react'; 

    class App extends React.Component { 

     render() { 
      return (
       <div className="wrapper"> 
        <h1>Welcome to App!!!!</h1> 
       </div> 
       ); 
     } 
    } 

    export default App; 

リンティングは私に次のエラーを示している。

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

に純粋関数としてそれを書くためにどのようにこのエラーを避ける？状態を維持する必要はありません

import React from 'react'; 

const App =() => { 
    return (
    <div className="wrapper"> 
      <h1>Welcome to App!!!!</h1> 
    </div> 
    ); 
} 

export default App; 

コンポーネントは、「ステートレス」と呼ばれ、通常は、状態を維持する必要がない限り、使用することをお勧めと考えています。このよう

Answer 1

Answer 2

import React from 'react'; 

const App = (props) => (
    <div className="wrapper"> 
    <h1>Welcome to App!!!!</h1> 
    </div> 
); 

export default App; 

Answer 3

このようにそれを書く：

import React from 'react'; 

var App =() => { 
    return (
     <div className="wrapper"> 
      <h1>Welcome to App!!!!</h1> 
     </div> 
    ); 
} 

export default App; 

理由です：あなたは純粋な機能としてそれを行うことができますので、あなたは、この状態または任意のライフサイクルメソッドを使用していません。基本的にはStateless Functional Componentとして知られています。

詳細はdocをご確認ください。

Answer 4

単純な関数で十分ですが、クラス全体（ステートフルコンポーネントにのみ使用する必要があります）は必要ありません。あなたは別のエラーに

import React from 'react'; 

export default const App =() => (
    <div className="wrapper"> 
    <h1>Welcome to App!!!!</h1> 
    </div> 
); 

または

import React from 'react'; 

export default function App() { 
    return (
    <div className="wrapper"> 
     <h1>Welcome to App!!!!</h1> 
    </div> 
); 
}