lingliu0824的博客

1.react性能消耗主要在diff算法过程，所以性能优化主要在于减少不必要的diff算法1.1减少非批更新阶段（setTimeout,setInterval,promise回调）中setState的调用次数，如在回调的最后统一执行setState补充： 非批更新阶段：setTimeout,setInterval,promise回调,原生dom通过addEventListener绑定的事件中1.2通过componentShouldUpdate减少不必要的更新(每次state或props更新都会触发组件

需求：可制定不同的角色以及对应角色可以访问的页面实现：1.登录后根据用户角色字段获取该角色能够访问的页面路径2.将能够访问的路径存储到全局（这里用的是localstorage)3.在涉及权限的路由下使用自定义路由组件PrivateRoute代替Route（关于某一菜单/路径是否是需要权限的页面，可以在配置菜单数组的时候新增一个字段，值为true/false对应是否需要权限）import React from "react";import { Route } from "react-router-dom

问题：antd Table提供了数据行可选择的操作，但是如果分页数据是从后端获取，切换页码后之前的分页数据就没有了，回到之前的页面选中状态也无法保留。解决：这里对ant Table表格组件进行了封装，实现了在分页数据动态获取时切换页码其他页选中的数据和状态仍保留的功能思路：1.定义curPageSelectedRowKeys存储当前页选中数据的key值数组，selectedRows存储所有选中数据2.监听当前页数据选中/取消选中和全选/取消全选操作，更新curPageSelectedRowKey

场景：在更新了state中的字段A后需要调用一个更新数据的方法getData，此方法需要使用字段A的值,如何保证getData方法拿到的A是最新的。如果不使用Hook，则可以1.使用this.setState()传递两个参数，一是更新state的对象或者函数，二是state设置生效后需要执行的副作用。2.在生命周期componentDidUpdate中监听A字段的变化this.setState( { A:'newData' }, ()

问题：使用antd table的分页和选择功能时，切换了分页，选中状态仍然保留在第一页选中前三条数据切换到第二页后前三条也被选中，但打印selectedRowKeys为[0,1,2]选中的只有3条数据解决：为每条数据加上key字段（如果本来就存在key字段且值唯一，则无需再单独添加）：...

最近的一个需求：需要从A路由页面（"/view/personal/user"）携带一数组对象到B路由页面("/view/sysMng/user")，从而设置B页面的初始值。最初想到的方法就是通过路由传参在A页面路由跳转时将数据放入state中，然后在B页面的componentDidMount生命周期函数中通过props.location.state接收//A页面执行editRole方法进行路由跳转并携带state数据 private editRole = row => { this.pr

1.组件名的首字母必须为大写字母：否则无法正常渲染，控制台报错2.不能为一个标签定义多个class属性，否则只有最后一个属性值会生效。实际结果：可以通过下面的方式添加多个class值：注意class1后面有个空格3.标签中的style值不能为字符串，必须为对象结果：浏览器报错可以使用下面两种方式定义style的内容4.组件中标签绑定state、props的值或者类组件中其他方法，需要使用this. 来调用，且要用{}括起来注意虽然这里再在render中传入了一个props但是