⭐Redux入门教程
http://www.ruanyifeng.com/blog/2016/09/redux_tutorial_part_one_basic_usages.html
⭐React脚手架搭建及配置,有如何更改localhost端口。
https://www.cnblogs.com/cina33blogs/p/9115215.html
⭐npm安装antd出错时,尝试一下cnpm或者yarn。
⭐JS自动分号(ASI)规则
⭐终端退出END,按Q键即可。
⭐Echarts坐标轴需要给定最大值时,可以用yAxis.max。
⭐关于!==、===
https://www.cnblogs.com/theWayToAce/p/5599575.html
⭐toLocaleString() 方法可根据本地时间把 Date 对象转换为字符串,并返回结果,很有用。
https://www.runoob.com/jsref/jsref-tolocalestring.html
⭐React项目需要做一些配置的时候需要使用 npm run eject 来暴露配置。
https://segmentfault.com/a/1190000012996829
⭐JS的节流和防抖,招聘时候笔试题目里也有,节流就是一段时间内只能触发一次,防抖就是触发后先不执行如果规定时间内再没触发就执行。
https://segmentfault.com/a/1190000018428170
⭐一个Echarts水波球样式
https://blog.csdn.net/qq_36652782/article/details/108871978
⭐'react-scripts' 不是内部或外部命令,也不是可运行的程序或批处理文件
create-react-app会有丢包现象, npm i 或者 npm install react-scripts
⭐react+ts配置路径别名
https://www.h5w3.com/66077.html
⭐使用vw布局,以及插件postcss-px-to-viewport。
https://www.cnblogs.com/zhangnan35/p/12682925.html
https://blog.csdn.net/zywpurple/article/details/109112252
http://caibaojian.com/vw-vh.html
⭐ES2020链判断运算符,在处理一些数据但是请求还没回来时为空,特别有用。
https://www.cnblogs.com/teamemory/p/12531958.html
⭐React应用中,scss公共样式会因为组件数量重复引入的问题。
被全局引用的scss文件(如index.scss),不要放具体的css代码。应该只放scss变量,函数,混合等,不会产生污染的东西,如果是希望全局引用的css样式文件,在入口js引一次即可。
https://segmentfault.com/q/1010000018020657
⭐React循环遍历数组和元素对象,这里注意一下ForEach,map需要有返回值,ForEach不需要返回值。
https://www.pianshen.com/article/1643375822/
⭐CSS字间距离
text-indent设置抬头距离CSS缩进。
letter-spacing来设置字与字间距,字符间距离。
http://www.divcss5.com/rumen/r75.shtml
⭐React路由传递多个参数
https://blog.csdn.net/dolores_me/article/details/106584070
⭐React点击返回上一级路由
https://blog.csdn.net/ajqdnbh656415/article/details/101809026
⭐JS中拷贝数组的方法,JSON.parse + JSON.stringify是深复制!
https://www.cnblogs.com/yshusen/archive/2004/01/13/13073512.html
⭐React Router中的Link和NavLink
https://blog.csdn.net/lhjuejiang/article/details/80366839
⭐React获取URL
https://blog.csdn.net/qq_24147051/article/details/78786325?a=b
⭐React.componentDidMount异步获取页面初始数据setState后,页面return没有数据的情况,主要的问题是后台请求是异步的,所以需要判断loading。
https://blog.csdn.net/guanrandang0061/article/details/99636309
⭐React组件的componentDidMount、componentWillUnmount与DOM节点渲染的先后顺序。
组件内先执行constructor内state的初始状态,然后执行render,将初始状态在页面中呈现出来,然后执行挂在钩子函数,最后执行卸载钩子函数。
https://blog.csdn.net/qq_39207948/article/details/97232227
⭐CSS样式中 .a>.b大于号指子代元素 p~ul指选择器p之后出现的所有ul
https://blog.csdn.net/lengyue1084/article/details/89306045
⭐Echarts将X轴固定在上方
1 option = { 2 xAxis: { 3 position: 'top', 4 type: 'category', 5 data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun'], 6 axisLine: { 7 onZero: false 8 } 9 }, 10 yAxis: { 11 inverse: true, 12 type: 'value' 13 }, 14 series: [{ 15 data: [820, 932, 901, 934, 1290, 1330, 1320], 16 type: 'line' 17 }] 18 };
https://www.imooc.com/wenda/detail/526116
⭐根据对象的某一属性进行排序的JS代码,很有用哦!
1 //定义一个对象数组 2 var data = [{ name: "jiang", age: 22 }, { name: "AAAAAAAAAAAAAA", age: 21 }, { name: "CCCCCCCCc", age: 25}]; 3 //定义一个比较器 4 function compare(propertyName) { 5 return function (object1, object2) { 6 var value1 = object1[propertyName]; 7 var value2 = object2[propertyName]; 8 if (value2 < value1) { 9 return -1; 10 } 11 else if (value2 > value1) { 12 return 1; 13 } 14 else { 15 return 0; 16 } 17 } 18 } 19 //使用方法 20 data.sort(compare("name")); 21 alert(data[0].name);//jiang 22 //使用方法 23 data.sort(compare("age")); 24 alert(data[0].age);//25s
⭐React table报错
1 Warning: validateDOMNesting(...): <tr> cannot appear as a child of <table>. See TopTen > table > tr. Add a <tbody> to your code to match the DOM tree generated by the browser.
代码源片段:
1 render() { 2 return ( 3 <table> 4 <tr> 5 <th>日期</th> 6 <th>耗时</th> 7 <th>错误</th> 8 <th>备注</th> 9 </tr> 10 </table> 11 ); 12 }
根据提示: Add a <tbody> to your code to match the DOM tree generated by the browser.
在tr上面加一层tbody就解决了。
⭐美化网页中的Table表格样式
https://www.wenjiangs.com/article/beautify-table.html
⭐CSS让Table里的字居中
1 vertical-align: middle
https://www.html.cn/qa/css3/13658.html
⭐JS实现图片旋转
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>图片旋转</title> 5 <script> 6 window.onload = function(){ 7 var current = 0; 8 document.getElementById('showImg').onclick = function(){ 9 current = (current+90)%360; 10 this.style.transform = 'rotate('+current+'deg)'; 11 } 12 }; 13 </script> 14 </head> 15 <body> 16 <img id ="showImg" src=""> 17 </body>
https://www.cnblogs.com/henuyuxiang/p/10656415.html
⭐CSS实现下拉菜单
https://www.cnblogs.com/yewenxiang/p/6064117.html
⭐git pull拉取
git pull origin master 是将远程主机的master分支最新内容拉下来后与当前本地分支直接合并 fetch+merge
https://blog.csdn.net/weixin_30699831/article/details/101982286
⭐React使用nprogress
https://blog.csdn.net/qq_29232955/article/details/108997059
⭐React反向代理使用http-proxy-middleware
https://blog.csdn.net/jenie/article/details/105712735
⭐React使用fetch封装请求的方法
https://www.cnblogs.com/seemoon/p/12720172.html
⭐for in遍历的是属性名,在数组中即下标,for of遍历的是属性值。
https://www.cnblogs.com/shige720/p/11469717.html
⭐vue中 v-for循环解决img标签的src动态绑定问题
https://blog.csdn.net/colourfultiger/article/details/80675388
⭐JS获取屏幕宽度高度
1 document.body.clientWidth ==> BODY对象宽度 2 document.body.clientHeight ==> BODY对象高度 3 document.documentElement.clientWidth ==> 可见区域宽度 4 document.documentElement.clientHeight ==> 可见区域高度 5 6 网页可见区域宽: document.body.clientWidth 7 网页可见区域高: document.body.clientHeight 8 网页可见区域宽: document.body.offsetWidth (包括边线的宽) 9 网页可见区域高: document.body.offsetHeight (包括边线的高) 10 网页正文全文宽: document.body.scrollWidth 11 网页正文全文高: document.body.scrollHeight 12 网页被卷去的高: document.body.scrollTop 13 网页被卷去的左: document.body.scrollLeft 14 网页正文部分上: window.screenTop 15 网页正文部分左: window.screenLeft 16 屏幕分辨率的高: window.screen.height 17 屏幕分辨率的宽: window.screen.width 18 屏幕可用工作区高度: window.screen.availHeight 19 屏幕可用工作区宽度: window.screen.availWidth 20 21 // 部分jQuery函数 22 $(window).height() //浏览器时下窗口可视区域高度 23 $(document).height() //浏览器时下窗口文档的高度 24 $(document.body).height() //浏览器时下窗口文档body的高度 25 $(document.body).outerHeight(true) //浏览器时下窗口文档body的总高度 包括border padding margin 26 $(window).width() //浏览器时下窗口可视区域宽度 27 $(document).width()//浏览器时下窗口文档对于象宽度 28 $(document.body).width() //浏览器时下窗口文档body的高度 29 $(document.body).outerWidth(true) //浏览器时下窗口文档body的总宽度 包括border padding 30 31 HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth 32 scrollHeight: 获取对象的滚动高度。 33 scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 34 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 35 scrollWidth:获取对象的滚动宽度 36 offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 37 offsetLeft:获取对象相对于版面或由 offsetParent 属性指定的父坐标的计算左侧位置 38 offsetTop:获取对象相对于版面或由 offsetTop 属性指定的父坐标的计算顶端位置 39 event.clientX 相对文档的水平座标 40 event.clientY 相对文档的垂直座标 41 event.offsetX 相对容器的水平坐标 42 event.offsetY 相对容器的垂直坐标 43 document.documentElement.scrollTop 垂直方向滚动的值 44 event.clientX+document.documentElement.scrollTop 相对文档的水平座标+垂直方向滚动的量