![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
react
文章平均质量分 68
Web企鹅
这个作者很懒,什么都没留下…
展开
-
序列化和反序列化
好好的深入梳理下序列化与反序列化原创 2022-05-21 10:15:00 · 179 阅读 · 0 评论 -
react 百度地图定位
做了个百度地图定位,真是一步一个坎儿,遇到的问题和解决过程记录在这里,每一个坑我都亲自踩过,解决办法也亲测有效原创 2022-05-08 14:45:00 · 1949 阅读 · 2 评论 -
自写日历(周日历,农历节日节气)
详细的写了一个日历组件,把遇到的问题整理在这里目录antd 的日历组件显示中文antd 的日历组件显示中文import locale from 'antd/lib/calendar/locale/zh_CN.js'<Calendar fullscreen={false} onPanelChange={this.onPanelChange} locale={locale}/>...原创 2022-04-23 13:45:00 · 1607 阅读 · 1 评论 -
Ant Design 表单手机号验证
rules :[ { pattern: /^1[3|4|5|7|8][0-9]\d{8}$/, message: '请输入正确的手机号' }]或者rules :[ { pattern: /^1(3[0-9]|4[01456879]|5[0-3,5-9]|6[2567]|7[0-8]|8[0-9]|9[0-3,5-9])\d{8}$/, message: '请输入正确的手机号' }]另附一篇我看到比较全面的校验博客:https://blog.csdn.net/itbra原创 2021-01-26 12:23:59 · 4955 阅读 · 0 评论 -
React 新旧生命周期对比,快速理清
之前的生命周期react-v16.3 之前版本的生命周期原创 2020-10-26 17:31:56 · 181 阅读 · 0 评论 -
React 报错:Newline required at end of file but not found
代码没有问题,却在代码最后一行显示错误: http://eslint.org/docs/rules/eol-last Newline required at end of file but not found 解决:在每个 js 文件写完后 要多写一行的空白行原因:eslint rules规则限制了:eslint eol-last: ["error", "always"]eslint eol-last: ["warn", "never"]eslint eol-last:0代码关原创 2020-10-15 15:49:39 · 274 阅读 · 0 评论 -
react 给选中的 li 添加样式
react 给选中的 li 添加样式思路:使用事件委托,关键:获取到的index必须转为数字,因为它是字符串handleClick = (e) => { const nodeName = e.target.nodeName.toUpperCase() let tag = e.target; if (nodeName === 'LI') { let index = parseInt(tag.getAttribute('inde转载 2020-09-25 11:55:00 · 709 阅读 · 2 评论 -
路由库 React-Router
基本用法通过管理 URL,实现组件的切换和状态的变化;使用时,路由器 Router 就是 React 的一个组件;Router 组件本身只是一个容器,真正的路由要通过 Route 组件定义;可以同时使用多个Route组件,也可以嵌套使用;path 属性Route组件的path属性指定路由的匹配规则:设置 path 属性:当路径匹配时,加载指定组件;省略 path 属性时:不管路径是否匹配,总是会加载指定组件;通配符规则如下::paramName:paramName 匹配原创 2020-09-21 11:59:15 · 233 阅读 · 0 评论 -
React 中关于 key 的基础知识
在 React 中,当创建一个元素时,必须包括一个特殊的 key 属性,否则,运行代码时,将会看到一个警告 a key should be provided for list items为什么要用 keykey 帮助 React 识别哪些元素改变了,比如被添加或删除。因此你应当给数组中的每一个元素赋予一个确定的标识。在新增 key 之后使得之前的低效转换变得高效。设置 key通常,我们使用数据中的 id 来作为元素的 key:<li key={xxx.id}>当元素没有确定原创 2020-09-21 09:37:07 · 452 阅读 · 0 评论 -
React 之 事件处理与条件渲染
需要注意 React 和 DOM 的区别:React 事件的命名采用 小驼峰式(camelCase),而不是纯小写;使用 JSX 语法时你需要传入 一个函数 作为事件处理函数,而不像 DOM 那样,是一个字符串;不能通过返回 false 的方式阻止默认行为。你必须显式的使用 preventDefault();绑定 this 的方法以下回调函数名称用 handleClick 来表示方法一:bind在 constructor 中:this.handleClick = this.handle原创 2020-09-19 11:18:38 · 217 阅读 · 0 评论 -
React 中重要的 JSX
了解 JSXReact 使用 JSX 来替代常规的 JavaScript。JSX是一种JavaScript的语法扩展,运用于React架构中,其格式比较像是模版语言,但事实上完全是在JavaScript内部实现的。元素是构成React应用的最小单位,JSX就是用来声明React当中的元素,React使用JSX来描述用户界面。通俗的讲,JSX 将 < 开头的解析成 html,将 { 开头的解析成 javascriptps:由于 JSX 就是 JavaScript,一些标识符像 c原创 2020-09-15 18:06:55 · 155 阅读 · 0 评论 -
React 小白初入门
推荐学习:React 官方文档:https://react.docschina.org/React 菜鸟教程:https://www.runoob.com/react/react-tutorial.html关于React特点描述库React 是一个用于构建用户界面的 JavaScript 库声明式设计采用声明范式,可以轻松描述应用高效通过对 DOM 的模拟,最大限度地减少与 DOM 的交互灵活可以与已知的库或框架很好地配合JSXJSX 是原创 2020-09-13 14:17:00 · 1352 阅读 · 1 评论