zl程序教程

React教程

  • React useReducer 终极使用教程

    React useReducer 终极使用教程

    本文完整版:《React useReducer 终极使用教程》useReducer 是在 react V 16.8 推出的钩子函数,从用法层面来说是可以代替useState。相信前期使用过 React 的前端同学,大都会经历从 class 语法向 hooks 用法的转变,react 的 hooks 编程给我们带来了丝滑的函数式编程体验,同时很多前端著名的文章也讲述了 hooks 带来的前端心智的转

    日期 2023-06-12 10:48:40     
  • React教程(详细版)

    React教程(详细版)

    大家好,又见面了,我是你们的朋友全栈君。 一、简介(背景) 本文篇幅较多,建议耐心看完,我相信多少会对你有所帮助! 1.1、概念它是一个将数据渲染为HTML视图 的js库1.2、原生js痛点用dom的API去操作dom,繁琐且效率低用js直接操作dom,浏览器会进行大量的回流和重绘原生js没有组件化的编程方案,代码复用性低,哪怕有模块话的概念,但模块化也只能拆解一个个js,对样式和结构也没办

    日期 2023-06-12 10:48:40     
  • React Hooks教程之基础篇

    React Hooks教程之基础篇

    什么是HooksHook 是 React 16.8 的新增特性。它可以让你在不编写 class 的情况下使用 state 以及其他的 React 特性。为什么要用Hooks代码可读性好,易于维护1.hooks在function组件中使用,不用维护复杂的生命周期,不用担心this指向问题Hooks给Function组件赋能,Function组件也可维护自己的state,不用担心组件通信过程中this

    日期 2023-06-12 10:48:40     
  • reactjs hook教程:useCallback记忆函数,将函数进行缓存,提高渲染性能

    reactjs hook教程:useCallback记忆函数,将函数进行缓存,提高渲染性能

    日期 2023-06-12 10:48:40     
  • React DnD简明教程

    React DnD简明教程

    React DnD简明教程 概述 React Dnd不同于其他的拖拽库,如果你以前没有用过它可能会被吓到。然而,一旦你了解了它设计的一些核心概念,它将变得有意义。我建议你在阅读文

    日期 2023-06-12 10:48:40     
  • React 测试入门教程

    React 测试入门教程

    Todo项的初始状态("未完成"或"已完成")应该正确 点击一个Todo项,它就反转状态("未完成"变为"已完成",反之亦然) 点击删除按钮,该Todo项就被删除 点击添加按钮,会新增一个Todo项 三、官方测试工具库 我们知道,一个React组件有两种存在形式:虚拟DOM对象(即React.Component的实例)和真实DOM节点。官方测试工具库对这两种形式,都提供测试解决方案。

    日期 2023-06-12 10:48:40     
  • ReactNavtive框架教程(2)

    ReactNavtive框架教程(2)

    原文:http://www.raywenderlich.com/99473/introducing-react-native-building-apps-javascript 注意:全部图片放在了百度相冊空间,假设你看不到图片,请复制图片URL,然后粘贴到地址栏中进行查看。Hello World JSX前面我们用React.createElement构建了一个简单的UI 。React

    日期 2023-06-12 10:48:40     
  • 从零开始的react入门教程(八),redux起源与基础用法

    从零开始的react入门教程(八),redux起源与基础用法

    壹 ❀ 引 我们在从零开始的react入门教程(七),react中的状态提升,我们为什么需要使用redux一文中介绍了react的状态提升,对于不同组件之间状态需要通信时,将状态提升至两个组件共有的最近父组件进行管理是官方较为推荐的做法。 但随之暴露的问题也非常明显,如果组件层级跨越较大,遥远的父组件将状态通知到目标组件时,可能需要通过多层组件进行数据传递,对于这些组件而言,数据传递很明显是没

    日期 2023-06-12 10:48:40     
  • 从零开始的react入门教程(七),react中的状态提升,我们为什么需要使用redux

    从零开始的react入门教程(七),react中的状态提升,我们为什么需要使用redux

    壹 ❀ 引 在前面的文章中,我们了解到react中的数据由props与State构成,数据就像瀑布中的水自上而下流动,属于单向数据流。而这两者的区别也很简单,对于一个组件而言,如果说props是外部传递进来的属性,那么State便是组件内部自身提供的属性。当然这个组件又可以将自己的State与props作为props继续传递给自己的子级,比如下图: 而对于props与State的通信,我们也

    日期 2023-06-12 10:48:40     
  • 从零开始的react入门教程(五),了解react中的表单,何为受控组件与非受控组件

    从零开始的react入门教程(五),了解react中的表单,何为受控组件与非受控组件

    壹 ❀ 引 我们在从零开始的react入门教程(四),了解常用的条件渲染、列表渲染与独一无二的key一文中介绍了react中常用的条件渲染操作,比如三元运算符,逻辑运算符等,结合react组件或者react元素,我们能做到很多视图层的切换效果。 除此之外我们也介绍了react中的渲染操作,不同于vue类似框架使用循环指令,react中直接使用数组API达到渲染元素元素块的操作;说到循环我们不得

    日期 2023-06-12 10:48:40     
  • 从零开始的react入门教程(一),让我们从hello world开始

    从零开始的react入门教程(一),让我们从hello world开始

    壹 ❀ 引 按照之前的计划,从这个月开始,我将由浅至深更新一些react相关的技术博文。由于我目前也是react新手一名,所以文章本质上也算自己学习历程的记录,倘若这些文章能帮助到一些人那就再好不过了。那么这一篇文章就作为一个新的开端,从零开始一起变得更强吧,本文开始。 贰 ❀ 准备工作 在学习基础知识之前,我们可以在本地搭建并运行一个react应用,便于后续学习时例子效果预览。请先确保电脑已

    日期 2023-06-12 10:48:40     
  • Chrome 扩展教程之如何使用 React 构建 Chrome 扩展(教程含源码)

    Chrome 扩展教程之如何使用 React 构建 Chrome 扩展(教程含源码)

    创建自己的 Chrome 扩展程序比许多人想象的要容易。这很有趣。我们可以尽情发挥我们的创造力,根据需要修改每个网站。 在本文中,我将首先向您展示如何设置 Chrome 扩展程序。之后,我们将设置一个 React 应用程序

    日期 2023-06-12 10:48:40     
  • React教程之 React 中 Render Props 和高阶组件HOC的详细介绍

    React教程之 React 中 Render Props 和高阶组件HOC的详细介绍

    如果你最近在做一些React 开发,你一定遇到过 HOCs 和 Render Props 之类的术语。在本文中,我们将深入探讨这两种模式,以了解我们为什么需要它们以及如何正确使用它们来构建更好的 React 应用程序。 为

    日期 2023-06-12 10:48:40