React-代码规范
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-代码规范的更多相关文章
- 4.1 react 代码规范
关于 基础规范 组件结构 命名规范 jsx 书写规范 eslint-plugin-react 关于 在代码的设计上,每个团队可能都有一定的代码规范和模式,好的代码规范能够提高代码的可读性便于协作沟通, ...
- React Native开发的一种代码规范:Eslint + FlowType
[这篇随笔记录的很简单,没有涉及具体的Eslint规则解释以及FlowType的类型说明和使用等,只是链接了所需的若干文档] js开发很舒服,但是代码一多起来就参差不齐,难以阅读了.所以加上一些代码规 ...
- 在Git上如何强推代码规范
引言 最近参加了“前端规范制定topic”小组,小组成员一起制定了html.css.js.es6.vue和react等规范,但规范制定好了怎么进行推广去强制执行呢,已知我们的项目都是用git做管理的, ...
- JavaScript必备:Google发布的JS代码规范(转)
[翻译]关于Google发布的JS代码规范,你需要了解什么? 翻译 | WhiteYin 译文 | https://github.com/WhiteYin/translation/issues/10 ...
- 中小型前端团队代码规范工程化最佳实践 - ESLint
前言 There are a thousand Hamlets in a thousand people's eyes. 一千个程序员,就有一千种代码风格.在前端开发中,有几个至今还在争论的代码风格差 ...
- eslint+prettier+husky+lint-staged 统一前端代码规范
eslint+prettier+husky+lint-staged 统一前端代码规范 遵循编码规范和使用语法检测,可以很好的提高代码的可读性,可维护性,并有效的减少一些编码错误. 1.终极目标 团队中 ...
- iOS代码规范(OC和Swift)
下面说下iOS的代码规范问题,如果大家觉得还不错,可以直接用到项目中,有不同意见 可以在下面讨论下. 相信很多人工作中最烦的就是代码不规范,命名不规范,曾经见过一个VC里有3个按钮被命名为button ...
- 谈谈PHP代码规范
[转] http://www.syyong.com/php/Talk-about-PHP-code-specification.html 我向往这样一个php世界,里面没有代码规范之争.你我都一样,都 ...
- 2016 正确 sublime安装PHPcs PHPcodesniffer代码规范提示插件,修正网上部分不详细描述
对你有助请点赞,请顶,不好请踩------送人玫瑰,手留余香!-------------------14:37 2016/3/212016 正确 sublime安装PHPcs PHPcodesniff ...
- C#与Java对比学习:类型判断、类与接口继承、代码规范与编码习惯、常量定义
类型判断符号: C#:object a; if(a is int) { } 用 is 符号判断 Java:object a; if(a instanceof Integer) { } 用 inst ...
随机推荐
- 附实例!图解React的生命周期及执行顺序
本文由云+社区发表 作者:前端林子 1.七个可选的生命周期 可以结合下图来看: (1) componentWillMount() 仅在render()方法前被调用一次,如果在该方法中调用了setSta ...
- 系统开发中使用拦截器校验是否登录并使用MD5对用户登录密码进行加密
项目名称:客户管理系统 项目描述: 项目基于javaEE平台,B/S模式开发.使用Struts2.Hibernate/Spring进行项目框架搭建.使用Struts中的Action 控制器进行用户访问 ...
- Linux下Tomcat开启查看GC信息
本文收录在Linux运维企业架构实战系列 一.开启GC日志 1.在Tomcat 的安装路径下,找到bin/catalina.sh 加上下面的配置,具体参数,自己配置: [root@centos7 to ...
- 从零开始学安全(三十一)●kali 输入 msfconsole 启动报错
解决方法: 实际上是因为没安装就开启了msf,用下面三个命令就解决了 sudo apt-get updatesudo apt-get install metasploit-frameworkmsfco ...
- Linux万能快捷键与命令
tab键:补全命令 \ :命令折行写 Ctrl+C :结束命令 --help :查看命令详细信息 man :类似于help 比help更加详细. sudo :临时以管理员权限执行命令. 还有吗?
- 【Mybatis】使用Mybatis-Generator自动生成entity、dao、mapping
使用过mybatis的应该都有用过Mybatis-Generator,本文主要介绍使用Mybatis-Generator来自动生成entity.dao.mapping文件. Mybatis-Gener ...
- 阿里巴巴(alibaba)系列_druid 数据库连接池_监控(一篇搞定)记录执行慢的sql语句
参考帖子:http://www.cnblogs.com/han-1034683568/p/6730869.html Druid数据连接池简介 Druid是Java语言中最好的数据库连接池.Druid能 ...
- WEB前端 CSS(非布局)
目录 WEB前端 CSS CSS引入方式 CSS结构 CSS选择器 直接选择器 组合选择器 分组选择器 也叫并集选择器 属性选择器 伪类选择器 伪元素选择器 CSS选择器是一个查找的过程,高效的查找影 ...
- ccflow表机构与运行机制(二次开发必看)
驰骋工作流引擎,工作流程管理系统,表结构与运行机制. ------------------------------------------------------- 前言: 1, ccflow 有自动 ...
- sql server 临时表(上) Tempdb概述
一.概述 在sql server里临时表存储在TempDB库中,TempDB是一个系统数据库,它只有Simple恢复模式,也是最小日志记录操作.主要用于存放局部临时表,全局临时表,表变量,都是基于临时 ...