Todolist总结
一、组件类里面的函数尽可能写成箭头函数的形式,方便绑定this

上面的箭头函数是好的,写面的不好,他需要在用的时候绑定this,或者在constructor绑定,如下:

如上用的时候绑定this是不好的,每次render都会重新绑定,比这种好的是在constructor里面绑定,如下:

因此绑定this有两种方法,用箭头函数,或者在constructor里面绑定,推荐箭头函数
二、从state或者props取值赋值给变量的时候,用解构赋值、给默认值、容错处理


三、通过prop-types给组件的配置参数加上类型验证,你也可以在任何 PropTypes 属性后面加上 ’isRequired‘后缀,这样如果这个属性父组件没有提供时,会打印警告信息。虽然 propTypes 帮我们指定了参数类型,但是并没有说这个参数一定要传入,事实上,这些参数默认都是可选的。可选参数我们可以通过配置 defaultProps,让它在不传入的时候有默认值

具体的Proptypes用法如下:

四、在父、子、孙,三级,从父级传回调函数给孙,在每个子、孙配置PropTypes传参类型,和defaultProps之后,不要用if来判断有没有传回调函数,作为中间的子,直接将函数传下去,不要在写一个函数了,如下:
下面这个不好:

下面这样好:

五、组件间的调用用下划线做函数名

Todolist总结的更多相关文章
- Vue.js基础篇实战--一个ToDoList小应用
距离开始学Vue已经过去一个多月了,总想把学到的东西柔和在一起,做点东西出来,于是有了这个Todolist小应用. 使用vuex 纯粹基础,没有用到web pack,vuex,npm,下次把它改造一下 ...
- 重写官方TodoList,对于初学react+redux的人来说,很有好处
虽然官网的TodoList的例子写的很详细,但是都是一步到位,就是给你一个action,好家伙,全部都写好了,给你一个reducer,所有功能也是都写好了,但是我们这些小白怎么可能一下就消化那么多,那 ...
- [vue案例的知识点]todo-list
文章的原材料来自于vue的官方示例:https://cn.vuejs.org/v2/examples/todomvc.html,我们在学习过程中,试着对其中的一些知识点进行记录: 一.浏览器数据存储, ...
- 用vuejs实现一个todolist项目
用vue.js实现一个todolist项目:input输入框输入的值会呈现在下方,并且会保存在localStorage里面,而且下方的列表点击之后也会有变化: 完整代码: App.vue <te ...
- 基于angular写的一个todolist
对于新手来说,使用angularjs写一个todolist可以快速入门
- 使用React并做一个简单的to-do-list
1. 前言 说到React,我从一年之前就开始试着了解并且看了相关的入门教程,而且还买过一本<React:引领未来的用户界面开发框架 >拜读.React的轻量组件化的思想及其virtual ...
- jquery实现TODOList
html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <titl ...
- Android程序ToDoList增加配置项页面
本文要做的事情就是在前面做的简单的ToDoList程序上增加一个配置项页面(Reference).这个Reference页面也非常简单: 这个ToDoList现在有两个页面,主页面能填写待办事项,然后 ...
- Android程序ToDoList
本文的目的是创建一个简单的ToDoList列表. 这个应用的功能是记录我的代办事项,简单到不需要本地存储,所有的代办事项都只是存储在内存中,就是只有程序打开的时候可以增加查看代办事项,当程序关闭的时候 ...
- ToDoList:一款非常优秀的任务管理软件 —— 工具类
ToDoList是一款非常优秀的任务管理软件,用户可以方便地组织和安排计划.这是一个开源的项目,很多细节都考虑到了,推荐大家使用~ ToDoList 帮你把要做的事情列出来,一项一项,类似思维导图. ...
随机推荐
- 编译生成的h.gch文件是什么鬼?
所谓预编译头,就是把头文件事先编译成一种二进制的中间格式,供后续的编译过程使用.GCC编译头文件后的中间文件是*.gch. 如何将头文件编译为.gch文件呢?用g++编译,格式: g++ xxx.h ...
- MakeFile 文件的使用
什么是Makefile? 一个工程中的源文件不计其数,其按类型.功能.模块分别放在若干个目录中,makefile定义了一系列的规则来指定,哪些文件需要先编译,哪些文件需要后编译,哪些文件需要重新编译, ...
- 2019腾讯广告算法大赛 Rank23
由于官方审核代码,代码将在2019年6月28号后开源 写在前面 这次腾讯的第三届广告算法大赛,是我第一次参加,取得了初赛与复赛均为23名的成绩,毕竟我只是初打比赛不久的小白.我想在此分享下我的基本解题 ...
- css样式 -- 表格不会因为字体过长导致字体溢出的问题
常常碰到因为表格大小就麽大了,字体过长会爆炸溢出的问题,我们后端就用这个可以了,溢出的可以省略号 ... 代替好了. /* 在表格css样式加上这三个就可以了 效果就会变成 “abc...” */ { ...
- Algorithms : Programming Assignment 3: Pattern Recognition
Programming Assignment 3: Pattern Recognition 1.题目重述 原题目:Programming Assignment 3: Pattern Recogniti ...
- 我所理解的Restful API最佳实践
一直在公司负责API数据接口的开发,期间也遇到了不小的坑,本篇博客算是做一个小小的记录. 1. 不要纠结于无意义的规范 在开始本文之前,我想先说这么一句:RESTful 真的很好,但它只是一种软 ...
- python中panda的dateframe
1 函数介绍 #to_csv函数的语法#函数原型# to_csv(filepath,sep=",",index=TRUE,header=TRUE)#参数介绍: #(1)导出的文件路 ...
- TypeScript完全解读(26课时)_5.TypeScript完全解读-函数
5.TypeScript完全解读-函数 新建function.ts.然后在index.ts内引用 给函数定义参数类型:上面是es5的写法 下面是ts6的写法 一个完整的函数类型.括号 箭头 numbe ...
- Flutter实战视频-移动电商-62.购物车_首页Provide化 让跳转随心所欲
62.购物车_首页Provide化 让跳转随心所欲 新建provide/currentIndex.dart 内容比较简单,定义一个变量当前页面的索引currentIndex,再定义一个方法改变它的值 ...
- Lightoj 1094 【DFS】
题意: 给你一颗n-1条边的树,求某两点的最长路 思路: 随便找个根,然后我们从根往下搜,对于每个结点会出现多个子节点或者一个子节点或者没有结点, 多个子节点的话,就以他为中间点,在子节点中找两条最长 ...