Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Stateless Functional Component is better #304

Closed
jyane opened this issue Jul 31, 2016 · 1 comment
Closed

Stateless Functional Component is better #304

jyane opened this issue Jul 31, 2016 · 1 comment

Comments

@jyane
Copy link

jyane commented Jul 31, 2016

/template/src/App.js is now using React Component Class, but this component is stateless.
So I think <App /> should be Stateless Functional Component.

I'm not good at English, here is a code example of my idea.

ASIS:

class App extends Component {
  render() {
    return (
      <div className="App">
        <div className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h2>Welcome to React</h2>
        </div>
        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
      </div>
    );
  }
}

TOBE:

const App = () => (
  <div className="App">
    <div className="App-header">
      <img src={logo} className="App-logo" alt="logo" />
      <h2>Welcome to React</h2>
    </div>
    <p className="App-intro">
      To get started, edit <code>src/App.js</code> and save to reload.
    </p>
  </div>
);

If you agree this proposal, I will create a pull request!

@gaearon
Copy link
Contributor

gaearon commented Jul 31, 2016

Hi, we think most beginners would be confused seeing SFC there because we still don't use them as much in the documentation. Additionally they would not be sure how to add state or lifecycle methods. Moreover we would miss an opportunity to show that this project supports ES classes out of the box, so they would probably use createClass() syntax. Combined, these are the reasons we don't use SFC in this example.

@gaearon gaearon closed this as completed Jul 31, 2016
@lock lock bot locked and limited conversation to collaborators Jan 23, 2019
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants