项目实战总结

1.在app.js中全局监听路由变化 2.在router.js中设置动态路由middleRouter 3.middleRouter的层级不固定，功能包含路由权限和侧边栏是否展示

1.获取state的旧值 2. 需求1：子页面更改全局状态，主页面监听全局状态需求2：主页面监听全局状态，调用子页面的方法，类似表单提交，需要注意是否能拿到最新的全局状态

使用antd_upload组件上传图片和视频 上传方法 上传前限制 图片预览 change事件 antd提供的上传和预览，优先使用react-file-viewer，可以直接预览不同格式的文件

使用react-file-viewer插件预览不同格式的文件，转载自 https://juejin.cn/post/7075972660932378637#comment保存代码方便后续使用。

需求：前端实现倒计时功能，7天免登陆。点击获取验证码按钮后，按钮置灰，90秒后可以再次点击。 当登录到详情页，返回到登录页时，手机号回显，隐藏获取验证码按钮。 当更改手机号时，使用watch监听手机号

1_react中使用 1_1 同页面使用 1_2 父子组件中使用 父组件 子组件 注意点：一个ref只能绑定一个dom元素，子组件参数必须加上props 2_vue中使用_触发弹窗是否打开 父组件

前提条件：需要保证合并对象的优先级，就是以哪个对象为基准，合并对象 举例： newData是新获取的对象；oldData是本身就存在的对象，两者都可以发生变化 需求：新获取的数组对象优先级高，下标相同

1.需要使用iframe引入二维码 2.每次进入页面需要获取二维码和验证码，需要对是否超时进行判断，根据后端发送的消息，请求用户信息 3.监听验证码的键盘事件，表单验证，提交信息 4.前端整体结构

1.umi自带全局变量，process.env.NODE_ENV 2.根据判断在不同环境下的值，以生产环境为例 3.在初始化api时设置

1.搜索和展示列表之间的bug 1.1-bug产生的原因： 1.2-解决bug的思路： 1.3-代码展示： ` `

1.table自定义footer，目的==>将分页功能和其它功能都放在table尾部进行展示，需要将pagination设置为false，否则会在table底部出现默认的分页 ` `

form表单布局 1.在Form组件中使用formItemLayout,全局使用 ` ` 2.在Form组件中单独调整某一个布局，需要配合Row和Col进行使用，xs和xm是适配不同分辨率

1.路由跳转 1.1_在table列表中点击数据进行跳转页面 使用umi中自带的Link的to方法进行路由跳转 ` ` 1.2_直接使用umi自带的history进行路由跳转 ` ` 2.返回按钮 `

1.由中文 英文 数字 “_” “-”组成，必须以英文字母或者中文开头! 2.由英文、数字以及除 “ : ” “ , ” “ @ ” 之外的英文特殊字符组成! 3.必须是1~65535的整数!

在app.js中，对全局路由变化进行监听，实现当路由切换时，将滚动条重置到最顶端 获取类名，[0]表示第一个元素，通过scrollTo(0, 0)重置

1-引入相应的组件 2-对显示器大小进行判断布局 3-对form表单进行布局 3-对表单进行验证 通过在Form.Item上添加rule属性 4-验证信息

1-设置初始状态 2-对点击的图标设置显示和隐藏，添加点击事件 3-添加条件判断，显示和隐藏某些内容

1-请求过来的数据是数组，对数组进行遍历，需要先判断数组是否存在 2-如果是对象，则通过Object.prototype.hasOwnProperty.call(res.body,'id')

基于Umi effects都需要使用 try catch 做异常处理src文件夹下，新建app.js文件

table组件的渲染，跳转页面传递参数，接收参数选择性渲染，根据页数和数量数据改变，请求数据达到分页的效果