1.方法绑定this,统一写在consrtructor()里。

  constructor(props){
...
this.handleInputChange=this.handleInputChange.bind(this);
}
render() {
return (
...
<input onChange={this.handleInputChange}/>
...
);
}

2.子组件获取父组件的值,用解构的形式。

handleDelete(){
const {handleDeleteItem,index}=this.props;
handleDeleteItem(index)
}

3.JSX里不要写过多的逻辑代码,应该拆分出来。

4.让setState返回一个函数而不是对象。

this.setState(()=>({
inputValue:value
}));

5.用prevState而不是this.state。

this.setState((prevState)=>{
const list=[...prevState.list];
list.splice(index,1);
return {list};
});

React-代码规范的更多相关文章

  1. 4.1 react 代码规范

    关于 基础规范 组件结构 命名规范 jsx 书写规范 eslint-plugin-react 关于 在代码的设计上,每个团队可能都有一定的代码规范和模式,好的代码规范能够提高代码的可读性便于协作沟通, ...

  2. React Native开发的一种代码规范:Eslint + FlowType

    [这篇随笔记录的很简单,没有涉及具体的Eslint规则解释以及FlowType的类型说明和使用等,只是链接了所需的若干文档] js开发很舒服,但是代码一多起来就参差不齐,难以阅读了.所以加上一些代码规 ...

  3. 在Git上如何强推代码规范

    引言 最近参加了“前端规范制定topic”小组,小组成员一起制定了html.css.js.es6.vue和react等规范,但规范制定好了怎么进行推广去强制执行呢,已知我们的项目都是用git做管理的, ...

  4. JavaScript必备:Google发布的JS代码规范(转)

    [翻译]关于Google发布的JS代码规范,你需要了解什么? 翻译 | WhiteYin 译文 | https://github.com/WhiteYin/translation/issues/10 ...

  5. 中小型前端团队代码规范工程化最佳实践 - ESLint

    前言 There are a thousand Hamlets in a thousand people's eyes. 一千个程序员,就有一千种代码风格.在前端开发中,有几个至今还在争论的代码风格差 ...

  6. eslint+prettier+husky+lint-staged 统一前端代码规范

    eslint+prettier+husky+lint-staged 统一前端代码规范 遵循编码规范和使用语法检测,可以很好的提高代码的可读性,可维护性,并有效的减少一些编码错误. 1.终极目标 团队中 ...

  7. iOS代码规范(OC和Swift)

    下面说下iOS的代码规范问题,如果大家觉得还不错,可以直接用到项目中,有不同意见 可以在下面讨论下. 相信很多人工作中最烦的就是代码不规范,命名不规范,曾经见过一个VC里有3个按钮被命名为button ...

  8. 谈谈PHP代码规范

    [转] http://www.syyong.com/php/Talk-about-PHP-code-specification.html 我向往这样一个php世界,里面没有代码规范之争.你我都一样,都 ...

  9. 2016 正确 sublime安装PHPcs PHPcodesniffer代码规范提示插件,修正网上部分不详细描述

    对你有助请点赞,请顶,不好请踩------送人玫瑰,手留余香!-------------------14:37 2016/3/212016 正确 sublime安装PHPcs PHPcodesniff ...

  10. C#与Java对比学习:类型判断、类与接口继承、代码规范与编码习惯、常量定义

    类型判断符号: C#:object a;  if(a is int) { }  用 is 符号判断 Java:object a; if(a instanceof Integer) { } 用 inst ...

随机推荐

  1. 服务化改造实践 | 如何在 Dubbo 中支持 REST

    什么是 REST REST 是 Roy Thomas Fielding [[1]](#fn1) 在 2000 年他的博士论文 [[2]](#fn2) “架构风格以及基于网络的软件架构设计” 中提出来的 ...

  2. Java GUI 单机版五子棋

    前言 刚开始学java时接触到GUI,一时兴起写了个五子棋,五子棋的关键点在于判断输赢,其他的都没什么,现在翻出来整理并记录下来,不足之处还望各位路过的大佬多多指教. 代码实现 代码不多,四百多行,全 ...

  3. 结合JDK源码看设计模式——简单工厂、工厂方法、抽象工厂

    三种工厂模式的详解: 简单工厂模式: 适用场景:工厂类负责创建的对象较少,客户端只关心传入工厂类的参数,对于如何创建对象的逻辑不关心 缺点:如果要新加产品,就需要修改工厂类的判断逻辑,违背软件设计中的 ...

  4. Django学习之二:Django 项目创建 和 应用创建

    Django 项目创建 和 应用创建 创建一个Django项目 都是在相应平台的命令行环境下操作: 1. 进入用于存放项目的目录下 1.1 windows下切换目录:先进入具体的分区磁盘中如E盘就输入 ...

  5. es6 Symbol类型

    es6 新增了一个原始类型Symbol,代表独一无二的数据 javascript 原来有6中基本类型, Boolean ,String ,Object,Number, null , undefined ...

  6. vue结合axios使用入门

    Vue官方推荐的网络通信库不再是vue-resource了,推荐使用axios axios安装 npm: $ npm install axios bower: $ bower install axio ...

  7. 使用 empApi 组件实现 Change Data Capture 功能

    Change Data Capture 功能是从 Winter '19 版本开始正式启用的功能. 它是基于"发布-订阅"模式设计,可以将 Salesforce 中记录的改变自动推送 ...

  8. Lua在Redis中的应用

    转载至笑松小站http://blog.seoui.com/2018/01/27/redis-lua/ redis从2.6版本开始内置支持Lua解释器,解释器提供了3个函数来处理redis的命令redi ...

  9. 初级c++编码规范

        想了很久,第一篇文章还是应该写编码规范好一点.编码规范是一个仁者见仁的问题,为了避免复杂庞大,自己总结了一套简单版本的规范. 简介     本文介绍一份自己使用的C++编码规范.第一次正式进入 ...

  10. restful api与传统api的区别(方式及语法)

    示例:一个状态数据操作接口 传统模式: api/getstate.aspx- 获取状态信息api/updatestate.aspx - 更新状态信息api/deletestate.aspx - 删除该 ...