#React

使用react-app-rewired和customize-cra对默认webpack自定义配置

最近在学习react框架,之前一直都是用vue 开发,知道在vue 中知道如何配置一下相关的webpack 有助于开发,学react 过程中,我也在想这些该怎么配置啊,所以就有这篇文章。这篇文章主要是讲react-create-app生成的项目利用react-app-rewire...

在React中实现条件渲染的7种方法

借助react,我们可以构建动态且高度交互的单页应用程序,充分利用这种交互性的一种方法是通过条件渲染。条件渲染一词描述了根据某些条件渲染不同UI标签的能力。在react文档中,这是一种根据条件渲染不同元素或组件的方法。此概念通常被应用到如下情况中:从API渲染外部数据显示/隐藏元素切换应用程序功能实现权限级别认证与授权...

在 React 中使用 Typescript

用Typescript写 react 可比写 vue 舒服太多了,react 对ts的支持可谓天生搭档,如果要用ts重构项目,不像 vue 对项目破坏性极大,React可以相对轻松的实现重构。顺便一提:全局安装的 create-react-...
代码星球 ·2020-12-24

React 生命周期详解

react 旧版生命周期React的生命周期图如上所示,主要可分为初始化阶段、挂载阶段、更新阶段、卸载阶段。 初始化阶段发生在 constructor中的内容,在 constructor中进行state、props的初始化,在这个阶段修改state,不会执行更新阶段的生命周期,可...
代码星球 ·2020-12-24

React添加事件

react添加事件,和DOM上添加事件类似,但又有细微的不同.react添加事件,需要注意:1.React的事件命名采用小驼峰(camelCase)的命名方式,DOM采用的是纯小写的方式;2.使用jsX语法时,需要传入一个函数作为事件的处理函数,DOM传入的是一个字符串(虽然DOM中传入的事件名称也可以是函数名称,但数...
代码星球 ·2020-12-24

React 端的编程范式

dvajs 是Alibaba针对于 react/redux 技术栈基于elm概念编写的一套脚手架。两年前因为antd开始接触了这套脚手架。我的确很需要这套脚手架,对于新手来说,整合 react /redux/react-redux/react-router/react-...
代码星球 ·2020-12-24

在React应用程序中用RegEx测试密码强度

尽管一些组织认为应该由用户选择健壮的用户名和密码来保护自己,但是开发人员可以通过将规则包含在程序的设计中来帮助进行良好的密码选择。例如,开发人员可以通过加入进度条、百分比或颜色,来帮助用户在输入密码时规定密码的质量。许多人都知道弱密码很短,并且包含字母或数字,但绝不会同时包含两者。我们也知道强密码包括符号以及区分大小写...

React 中获取数据的 3 种方法及它们的优缺点

在执行I/O操作(例如数据提取)时,要先发送网络请求,然后等待响应,接着将响应数据保存到组件的状态,最后进行渲染。在 react 中生命周期方法、Hooks和 Suspense是获取数据的方法。接下用事例演示一下如何使用它们并说明每种方法的优点和缺点,以便咱们更好的编写异步操作代码。&nb...

react-绑定this并传参的三种方式

在事件中绑定this并传参:<inputtype="button"value="在事件中绑定this并传参"onClick={this.handleMsg1.bind(this,'','')}/>//在事件中绑定this并传参handleMsg1(arg1,arg2){console.log(this);/...

Vue和React有什么区别与优劣?我到底应该选择哪谁?

前端开发框架从最开始的jquery时代,到后来backbone,angular1,再到现在vue和react两分天下,也才用了不到十年的光景。最开始jquery是为了解决浏览器兼容性的问题而火起来的,准确的说它只是一个库,而不能成为框架。但随着前端页面的复杂度的增加,渐渐数据驱动和mv*的思想开始形成,有了backbo...

使用 React Testing Library 和 Jest 完成单元测试

在2020的今天,构建一个web应用对于我们来说,并非什么难事。因为有很多足够多优秀的的前端框架(比如 react,vue 和 Angular);以及一些易用且强大的UI库(比如 AntDesign)为我们保驾护航,极大地缩短了应用构建的周期。但是,互联网时代也急剧地改变了许多软...

关于创建React App的8个有趣事实

你所知道的一些事情,你可能不知道的一些事情Create react App是搭建react项目的快速方法。这样我们可以重点放在代码上,而不是构建工具上。 这个神奇的命令可以通过以下三种方式之一调用:npxcreate-react-appmy-appnpminitreact-appmy-ap...

别在js中写后台地址了,用好React/Vue脚手架的环境变量

背景前端开发都少不了对后台的调用,后台地址配置在哪里,是一个很纠结的问题为此大家开动脑筋,想了不少办法:豌豆资源搜索网站https://55wd.com广州vi设计公司http://www.maiqicn.com在代码中定义一个常量如baseUrl,后台请求时,统一拼上这个baseUrl;问题:本地、开发、测试、生产环...

react-native 实现页面之间的相互传值

用到 react Navigation组件兼容性:IOS/Android原理: react Navigation为页面的props上挂载了navigation对象,可用来做路由跳转,在做页面跳转时可以携带参数/回调方法前往目标页面,从而达到传参的目的。切换路由方法: &...

图解React组件生命周期

每个react类组件都包含“生命周期方法”(function组件是没有生命周期方法的),你可以重写这些方法,以便于在运行过程中特定的阶段执行这些方法。在接下来的文章中,生命周期方法的书写会遵照如下规则,以方便大家理解。1、加粗生命周期方法表示常用的生命周期方法,开发中会经常使用到。2、未加粗的生命周期方法表示罕见的生命...
首页上一页...678910...下一页尾页