#React

20个React面试题

组件是React应用程序UI的构建块。这些组件将整个UI分割成独立的、可重用的小块。然后,它呈现每个独立的组件,而不影响UI的其余部分。每个React组件必须强制拥有一个render()。它返回一个单一的React元素,该元素表示本机DOM组件。如果需要呈现多个HTML元素,则必须将它们分组在一个封闭标记内,如<...
开发笔记 开发笔记·2022-05-17

React是什么

React 是一个为数据提供渲染为HTML视图的开源JavaScript库。React视图通常采用包含以自定义HTML标记规定的其他组件的组件渲染。React为程序员提供了一种子组件不能直接影响外层组件的模型,数据改变时对HTML文档的有效更新,和现代单页应用中组件之间干净的分离。React使创建交互式UI变...
开发笔记 开发笔记·2022-04-26

create-react-app搭建的项目中添加bootstrap

react-bootstrap是一个非常受欢迎的针对react封装过的bootstrap,它本身不包含css,所以也是需要使用bootstrap原生库。在create-react-app建的项目目录中安装react-bootstrap。npminstallreact-bootstrap--save安装bootstrap...

Sentinel 1.5.0 正式发布,引入 Reactive 支持

近日,流控降级组件Sentinel的又一个里程碑版本1.5.0正式发布。该版本引入Reactive的支持,并提供多项新特性与改进。从1.5.0版本开始,Sentinel仅支持JDK1.7及以上版本,不再支持JDK1.6。现在,我们可以利用Java7的try-with-resources特性来更为简洁地使用Sentine...

react className的2种变量写法

ES6新增的不少语法都是极好用的,在拼接变量与字符串时,模版字符串``就是典型的用法以下是2种写法1<divclassName={"bubble-box"+''+`${item.class}`}key={index}style={{left:`${item.left}px`,top:`${item.top}px`...

react 利用react-hammerjs插件实现滑动特效和点击特效

react-hammerjs是一款由hammer.js的JS插件来实现在react中实现手势滑动的事件插件,它有各种各样的手势支持效果,这里我们就使用下它最简单的3种效果来实现我们要的动画分别是点击(onTap)、滑动(onPan)、滑动结束(onPanEnd)具体事件参数和其它事件可以参考官网动画效果上代码impor...

react this.props.form异步执行问题

最近在做一个选择器联动时,碰到this.props.form的异步执行问题,导致选择器一直没有办法联动如图,选择公司名称后,应该同步刷新门店选择默认值,但同时又要清空门店选择的上一次记录就用到了this.props.form中的setFieldsValue()方法来清空,但是this.props.form却是在最后才执...

react setState里的作用域

从接触racet开始,我们就认识了setState,它是对全局变量进去更新的一个重要方法,不仅可以更新数据,还能在更新后执行方法时直接调用刚刚更新的数据 今天碰到的问题就在于它的作用域的先后问题先看一段代码letproductList=React.createClass({mixins:[LoadingMix...
代码星球 代码星球·2021-02-21

react 使用Form组件如何清空上一次操作

最近在做一个表单联查时候,总是会发现后一个选择器会记住上一次选择的值,这会导致前一级选择器已经做出更新后,后一级选择器却还记住上一次的操作, 这里有个方法可以在上级选择器事件操作时清空Form组件的记录this.props.form.resetFields();整个表单事件 companyChang...

create-react-app创建项目后运行npm run eject命令报错解决办法

最近在用create-react-app创建项目,因要配置各种组件,比如babel,antd等,需要运行npmruneject命令把项目的配置文件暴露出来,但是还是一如既然碰到报错,因为是在本地新创建的文件,没有添加git记录把这个错误做个笔记,不要老是去查资料   大家可以在根目录下运行...

react 使用antd的TreeSelect树选择组件实现多个树选择循环

需求说明,一个帐号角色可以设置管理多个项目的菜单权限且菜单接口每次只能查询特定项目的菜单数据【无法查全部】 开发思路:1,获取项目接口数组,得到项目数据2,循环项目数据,以此为参数递归查询菜单数据【递归查询是为保证循环时数据异步请求顺序不稳定】3,将菜单数组组装成一个二维数组,以待循环树选择组件作展示数据使用...

react 如何处理页面加载时无法将获取缓存信息存入全局变量中

最近在做一个权限功能时,发现在读取用户公司ID进行列表查询时,无法钭读取到缓存中的数据存入页面全局变量中进行加载查询 将问题代码整理出来将信息存入缓存:letmenuList=Helper.getUserInfo();localStorage.setItem('_io_iframe_admin_menu_li...

react 使用antd的在图片列表或表格中实现点击其他元素Checkbox选中功能

antd官网上的Checkbox功能只能单独使用,在表格中加入Checkbox也只能点击Checkbox按钮才能实现选中或取消功能如果我们要实在表格行中点击或在图片列表中点击图片就能实现选中或取消,就需要单独添加事件,然后使用该事件对Checkbox操作的数组进行操作,才能实现该功能,简单来说就是为需要添加功能的地方再...

react 使用antd的多选功能做一个单选与全选效果

一个小而简单的单选全选功能,其实官网已经给出效果了,不过是我多做了些复合用法 addorupdatemodal.jsximportReactfrom"react";import{Modal,Table,Button,Checkbox,Card,Popconfirm}from'antd';importLoadi...

react 使用antd导航组件实现事件传递并局部刷新DOM

 我们要实现一个通过点击顶部导航来查询左侧菜单的一个功能在这个功能中,我们要应用到onClick={this.headNavMenuList.bind(this)}方法来传递点击不同按钮来传递不同的值 注意:如果我们要在后续事件中使用传递过来的参数来更新局部DOM,则可以不加.bind(this),...
首页上一页12345...下一页尾页