美文网首页
2019-05-10 react开发小贴士

2019-05-10 react开发小贴士

作者: 追夢的蚂蚁 | 来源:发表于2019-05-10 20:54 被阅读0次
小贴士

这里插入一些小贴示,大家可以注意到我们组件的命名和方法的摆放顺序其实有一定的讲究,这里可以简单分享一下个人的习惯,仅供参考。

组件的私有方法都用 _ 开头,所有事件监听的方法都用 handle 开头。把事件监听方法传给组件的时候,属性名用 on 开头。例如:

<CommentInput
onSubmit={this.handleSubmitComment.bind(this)} />

这样统一规范处理事件命名会给我们带来语义化组件的好处,监听(on)CommentInput 的 Submit 事件,并且交给 this 去处理(handle)。这种规范在多人协作的时候也会非常方便。

另外,组件的内容编写顺序如下:

  1. static 开头的类属性,如 defaultProps、propTypes。
  2. 构造函数,constructor。
  3. getter/setter(还不了解的同学可以暂时忽略)。
  4. 组件生命周期。
  5. _ 开头的私有方法。
  6. 事件监听方法,handle*。
  7. render开头的方法,有时候 render() 方法里面的内容会分开到不同函数里面进行,这些函数都以 render 开头。
  8. render() 方法。
    如果所有的组件都按这种顺序来编写,那么维护起来就会方便很多,多人协作的时候别人理解代码也会一目了然。

相关文章

  • 2019-05-10 react开发小贴士

    小贴士 这里插入一些小贴示,大家可以注意到我们组件的命名和方法的摆放顺序其实有一定的讲究,这里可以简单分享一下个人...

  • React Native开发小贴士

    1. 屏幕适配 RN布局使用的单位是dp,而开发人员从设计稿最方便获取的是px,所以需要一个工具类把px转成dp,...

  • react小贴士

    1.两个组件之间需要相互通讯的情况时,建议将:子组件的 state 数据提升至其共同的父组件当中保存。

  • React Native实战开发目录

    目录 React Native实战开发1:搭建开发环境 React Native实战开发2:布局 React Na...

  • React 入门语法

    React 的开发准备: React 开发用到的库有: react.js 是React 的核心库 react-do...

  • React Native开发中常用的Middleware

    React Native开发中常用的Middleware 在react 或者 react-native开发中,我们...

  • react工具

    react开发插件 React Developer Tools 。redux开发插件:Redux DevTools...

  • iOS 搭建 React Native 开发环境

    iOS 搭建 React Native 开发环境 iOS 搭建 React Native 开发环境

  • React性能优化小贴士

    平常在完成业务功能开发后,不知道你是否还会精益求精,做一些性能优化方面的工作呢?React框架中有一些性能优化相关...

  • iOS 开发是否要采用 React Native?

    iOS 开发是否要采用 React Native? iOS 开发是否要采用 React Native?

网友评论

      本文标题:2019-05-10 react开发小贴士

      本文链接:https://www.haomeiwen.com/subject/iauzoqtx.html