快乐双彩2009003开奖结果:Organizing a React component these days (H1/2018)

May 25th, 2018. Tagged: react

I started typing an answer to a question by @alexharrisonsax since my React book is written for the recent past (React 14) and things change. Twitter is not great for code discussions, so here goes.

Import dependencies

import React, {Component, Node} from 'react';

Declare the component

class App extends Component {}

Unless it's functional stateless component (preferably), in which case:

const App = ({name, description}) =>
  <div>
    <h1>{name}</h1>
    <h2>{description}</h2>
  </div>;

Flow

If using Flow, a good idea is to define the types of properties and state, like:

type Props = {
  name: string,
  description: string,
};

type State = {
  theTruth: boolean,
};

Then the class declaration becomes:

class App extends Component<Props, State> {
  state: State = { // property initializer for initial state
    theTruth: false,
  };

  // optional, only if the initial state is not good enough
  // or there are other things you need to do
  constructor(props: Props): void {
    super(props);
    this.state = { 
      theTruth: props.description === 'shall set you freeee',
    }; 
  }

  render(): Node {
    return <div>{/* fun with this.props and this.state */}</div>;
  }
}

Tell your friends about this post: Facebook, Twitter, Google+

Sorry, comments disabled and hidden due to excessive spam.

Meanwhile, hit me up on twitter @stoyanstefanov


  • 运城市在长三角招商引资149.9亿元 2019-04-08
  • 济南五胞胎雪虎宝宝亮相 四雌一雄萌态十足 2019-04-08
  • 去产能迎年中考 煤炭、钢铁企业债务问题依然存在 2019-04-07
  • 最高检等四部门出台意见 指导依法办理恐怖活动和极端主义犯罪案件 2019-04-07
  • 广州市黄埔区人民法院公告专栏 2019-03-28
  • 这个“海之宁”是个死抱着相对论旧谬误不放,疯狂反对科学新真理的跳梁“小丑”,这个跳梁“小丑”根本就不懂得尊重客观事实及其规律,总是无视、脱离、歪曲客观... 2019-03-22
  • 如何理解孔子这句话?北大教授胡军动情论生死 2019-03-21
  • 海外舆论关注中国最新军备 称赞习近平主席强军号令 2019-03-19
  • 女性之声——全国妇联 2019-03-19
  • 美司法部科米在希拉里邮件门调查中存在过失 2019-03-17
  • “四新”彰显党的十九大思想灵魂和精髓要义 2018-08-17
  • 热身赛-U17女篮73-68立陶宛 杨舒宇19分刘禹彤13分 2018-08-16
  • 七月流火:一半是甜蜜 一半是仁慈 2018-08-15
  • “嫦娥”飞向月球背面,将会揭开哪些秘密? 2018-08-15
  • 一代枭雄身后事:“曹操墓”认定过程缘何一波三折? 2018-08-04
  • 888| 908| 853| 112| 868| 401| 443| 63| 416| 952|