![](https://img-blog.csdnimg.cn/20201014180756916.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react
文章平均质量分 85
zzh1918
向上生长
展开
-
来聊一聊Redux的前身Flux
来聊一聊Redux的前身Flux(状态管理)转载 2018-06-15 09:02:52 · 212 阅读 · 0 评论 -
webSocket实现聊天室功能
前言我们知道服务器是一种应答模式,也就是说服务器只能被动提供服务,而不会主动推送信息给客户端。传统网站为了实现类似在线聊天的功能都是不断的给服务器发送信息询问是否有新消息也就是所谓的轮询。这种方式有很明显的弊端:大量耗费服务器内存和宽带资源,因为不停的请求服务器,很多时候 并没有新的数据更新,因此绝大部分请求都是无效请。WebSocket 是 HTML5 开始提供的一种在单个 TCP 连...原创 2019-08-01 13:29:30 · 9952 阅读 · 10 评论 -
react+koa实现留言板功能
前言自己用react+koa实现一个留言板的功能,在这里记录和总结截图原创 2019-08-01 13:08:55 · 1522 阅读 · 4 评论 -
jwt实现注册与登陆系统
前言自己用react+koa实现了一个包含登陆和注册功能的网址,在这里记录一下实现过程项目地址:预览地址:注册注册其实没什么好说的,就是要注意不要明文保存密码,否则数据库泄露后,密码会被其他人用来撞库使用。前台加密主要是为了防止post请求明文传递密码,本来我想在前端加密,然后数据库直接保存加密的密码到数据库,登陆时传递加密后的密码进行登陆,但是前端使用的加密工具加密同一个密码每次都...原创 2019-08-01 13:07:13 · 5252 阅读 · 2 评论 -
富文本编辑器braft-editor的使用
在写react时需要用到富文本编辑器,找了很多后最后选择了braft-editor富文本编辑器美观易用的react富文本编辑器可结合antd使用本质是封装的draft-js提供丰富的功能这里我只介绍常见的一些功能和问题,详情请参考官网基本使用通过value和onChange对editorState组件进行双向绑定,注意value的值的类型必须是editorState对象(这一点...原创 2019-08-01 13:05:12 · 20831 阅读 · 5 评论 -
react编写打字组件
前言效果原创 2019-07-17 12:18:29 · 577 阅读 · 0 评论 -
react-router(v4)路由跳转页面不更新的问题
在组件中如何获取history、match、location路由API?路由组件可以直接在props上获取,非路由组件需要用withRouter高级组件包裹后在props上获取在store或非组件的js中如何获取history路由API?//手动引入import {createBrowserHistory} from 'history'const history = createBr...原创 2019-06-18 11:19:53 · 12557 阅读 · 1 评论 -
React实现web音乐app(可预览)
暂未实现的功能:路由的过渡效果(本来想用react-transition-group,但没能成功,就用了css动画代替)路由组件缓存(路由后退时,会重新请求页面,滚动条的位置没有保存,页面刷新)图片懒加载(没有实现图片懒加载)上面的功能在react中实现或许有点麻烦,但是在vue中都可以很好的实现,比如vue自带了过渡组件,路由keep-alive,和 vue-lazyload 。...原创 2019-03-11 09:16:42 · 2146 阅读 · 0 评论 -
关于React中props.children
props和state代表着组件的属性和状态,属性只读而状态可变。this.props对象的属性与组件的属性一一对应,但是有一个例外,就是this.props.children属性props.childrenprops.children在每个组件上都可用。 它会包含组件的开始和结束标记之间的内容。这个属性和vue的插槽类似,都是在自定义组件中插入子节点。组件之间可以插入的内容可以...原创 2019-01-04 15:07:56 · 4042 阅读 · 0 评论 -
扩展create-react-app的webpack配置
在创建react项目时,我们一般用create-react-app脚手架来搭建项目。create-react-app对webpack的配置进行了封装并默认隐藏了配置文件。当我们需要对webpack的配置进行扩展时,需要执行npm run eject命名将配置文件暴露出来,然后在对配置文件进行扩展。这种方式的缺点:npm run eject命名不可逆,一旦配置文件暴露后就不可再隐藏扩展的...原创 2018-12-22 10:56:55 · 16822 阅读 · 1 评论 -
关于antd表单组件遇见的问题
公司在用antd+mobx做表单时遇见一些问题,自己解决并记录下来业务需求点击新增按钮时,弹出一个嵌入Form的Modal,填写完毕后验证表单点击编辑按钮时,弹出上一个Modal,并将以前的填写信息回显上去遇见的问题问题1、表单验证后错误信息已经打印到控制台上,但页面中并没有显示错误信息分析过程:填写表单时触发onFieldsChange将变化的value存放到store中...原创 2018-11-29 10:48:21 · 4476 阅读 · 0 评论 -
关于antd表单的双向绑定
公司使用antd+mobx进行开发,在使用表单的绑定时出现问题const objToForm = (obj)=>{ let target = {} for(let [key,value] of Object.entries(obj)){ target[key] = Form.createFormField({value}) } return target}cons...原创 2018-11-16 11:58:29 · 17987 阅读 · 5 评论 -
在React、Vue和小程序中使用函数节流和函数防抖
在上一篇中我总结了节流函数和防抖函数的基本原理:总结前端函数防抖与函数节流。接下来介绍一下防抖函数和节流函数在前端框架中的使用。在使用前一定要注意两个问题:this的指向事件对象的传递React中使用防抖函数和节流函数...原创 2018-10-31 15:25:16 · 6270 阅读 · 0 评论 -
前端国际化(react-intl)
antd/antd-mobile 国际化方案国际化方案概述前端国际化详解、举例国际化资源文件管理项目之间、开发者与翻译者之间的协作国际化规范附录扩展阅读国际化方案概述国际化是一个看似简单,实则非常复杂的领域,实际进行国际化工作时,大家会发现它往往会涉及很多内容:前端国际化服务端国际化国际化资源文件管理项目之间、开发者与翻译者之间如何协作而且,国际化方案往往与具体的...转载 2018-09-26 15:04:13 · 6089 阅读 · 1 评论 -
基于React+antd的后台管理模板(可预览)
自己利用业余时间,基于React+antd写了一个后台管理模板。主要是熟悉antd组件和React,页面主要还是展示页面,不涉及后台交互。特点:我用原创 2018-08-05 13:42:53 · 97030 阅读 · 61 评论 -
css模块化
自己在用react时,css全局作用一直困扰着我。网上看到一篇关于css的文章很不错 简单易懂的CSS Modules转载 2018-07-19 14:53:09 · 583 阅读 · 0 评论 -
React生命周期
React生命周期转载 2018-06-24 13:16:00 · 514 阅读 · 0 评论 -
[译]在 React.js 中使用 ES6+
在今年对 Instagram Web 进行全新的设计的时候,我喜欢在写 React 组件的时候,用上一些 ES6+ 的新特性。请允许我列举这些能够改变你写 React 应用方式的新特性。比起以往,这些特性能够使你撸起码来更加容易、有趣!类(Class) 使用 ES6+ 来编写 React 组件最明显的变化就是我们定义组件(类)的语法的方式。我们可以用定义一个继承了 React....转载 2018-06-15 17:31:04 · 353 阅读 · 0 评论 -
react+koa实现登陆、聊天、留言板功能后台
前端通过create-react-app脚手架搭建前端项目后端通过koa-generator脚手架搭建后端项目原创 2019-08-01 14:57:20 · 1655 阅读 · 2 评论