随笔分类 -  React

牛逼的前端框架
Node: 使用Express脚本库搭建本地的Web服务器
摘要：一、简介 在之前学习的React开发中，一直使用create-react-app脚手架创建和开发Web项目，通过搭配ReactRouter路由实现静态页面的交互，然后通过yarn start或npm start来启动项目，这个启动过程是由客户端服务器执行的。使用express脚手架生成的应用可以作为 阅读全文
posted @ 2019-12-28 11:28 XYQ全哥 阅读(558) 评论(0) 推荐(0)
React: 研究React Router的使用
摘要：一、简单介绍 在web开发者，我们可以看到许多的页面可以实现无缝跳转和切换，这些网站大多数都是由用户发送请求并打开若干个独立文件的一系列页面构成的，对于这些文件和资源，用户可以进行前进、回退、跳转等操作。但是，如果把这些操作放在单页面应用中执行的话，就会出现很多问题。因为单页面应用中，所有的内容都处 阅读全文
posted @ 2019-12-27 14:24 XYQ全哥 阅读(334) 评论(0) 推荐(0)
React: 研究React Redux的使用
摘要：一、简介 在上一篇的Redux文章中，详细介绍了Redux的概念和综合利用，开发者可以通过Redux的State管理系统管理整个应用程序的数据流，依靠功能完备的Store来分发Action，进而渲染和更新组件的UI。在我们之前的文章介绍中，根组件是保存State的组件，一般的Web开发，都是将Sta 阅读全文
posted @ 2019-12-24 17:53 XYQ全哥 阅读(479) 评论(0) 推荐(0)
React: 研究Redux的使用
摘要：一、简介 在上一篇文章中，大概讲了下Flux设计模式的使用，在末尾顺便提了一些基于Flux的脚本库，其中Redux已经毋庸置疑地成为了众多脚本库的翘楚之一。是的，Redux是基于Flux开发的，Redux库的尺寸非常小，代码量少，核心目的仍是处理数据流变化的问题。Redux并不完全是Flux，它只是 阅读全文
posted @ 2019-12-22 00:01 XYQ全哥 阅读(364) 评论(0) 推荐(0)
React: 研究Flux设计模式
摘要：一、简介 一般来说，State管理在React中是一种最常用的实现机制，使用这种state管理系统基本可以开发各种需求的应用程序。然而，随着应用程序规模的不断扩张，原有的这种State管理系统就会暴露出臃肿的弊端，state中大量的数据放在根组件，而且与UI联系紧密，明显会增加系统的维护成本。此时， 阅读全文
posted @ 2019-12-19 14:53 XYQ全哥 阅读(797) 评论(0) 推荐(0)
React: 高阶组件(HOC)
摘要：一、简介 如我们所知，JavaScript有高阶函数这么一个概念，高阶函数本身是一个函数，它会接收或者返回一个函数，进而对该函数进行操作。其实，在React中同样地有高阶组件这么一个东西，称为HOC，它也是一个函数，但是与高阶函数不同的是，高阶组件操作的是组件，它会接收一个组件作为参数，然后返回另外 阅读全文
posted @ 2019-12-18 14:12 XYQ全哥 阅读(1453) 评论(0) 推荐(0)
React: React集成脚本库Fetch
摘要：一、简介 React功能虽然很强大，但是说到底它仍然只是一个简单的创建视图的脚本库，如果想要实现一些更为复杂的业务逻辑，我们还需要使用React搭配其他的脚本库协同工作，以提高应用程序的性能。其中，Fetch就是一款优秀的polyfill请求脚本库，它允许用户使用Promise对象方便地创建API调 阅读全文
posted @ 2019-12-18 11:23 XYQ全哥 阅读(506) 评论(0) 推荐(0)
React: 通过React.Children访问特定子组件
摘要：一、简介 React中提供了很多常用的API，其中有一个React.Children可以用来访问特定组件的子元素。它允许用来统计个数、map映射、循环遍历、转换数组以及显示指定子元素，如下所示： 二、使用 需求：根据条件，根组件会选择需要显示的子组件进行展示。 可以看到三个子组件，只有优秀组件显示出 阅读全文
posted @ 2019-12-17 17:02 XYQ全哥 阅读(1315) 评论(0) 推荐(0)
React: React组件的生命周期
摘要：一、简介 在前面的第二篇博文中对组件的生命周期虽然做了一个大略介绍，但总感觉说的过于简单，毕竟生命周期是React组件的核心部分。在我们熟练使用React挂载和合成组件来创建应用表现层的过程中，针对数据异步或延时问题，只有充分利用组件的生命周期来把握框架载入和数据处理的时机，才能将组件性能发挥到合理 阅读全文
posted @ 2019-12-09 16:50 XYQ全哥 阅读(237) 评论(0) 推荐(0)
React: React的属性验证机制
摘要：一、简介 在开发中，属性变量类型的验证，几乎是任何语言都必须关注的问题，因为如果传入的数据类型不对，轻者程序运行仅仅是给出警告⚠️，严重的会直接导致程序中断，APP闪退或者web页面挂掉，这是很严重的bug问题。如我们所知，JavaScript是一种弱类型的语言，这意味着开发者可以随意地修改变量值的 阅读全文
posted @ 2019-12-05 15:57 XYQ全哥 阅读(765) 评论(0) 推荐(0)
React: React脚手架
摘要：一、简言 React开发目前已经非常流行，对于如何实现对React项目的管理和维护，React生态圈出现了大量可用的开发工具，例如Browserify、Gulp、Grunt、webpack等。其中，webpack称为CommonJS模块的主流工具之一，它是一个模块绑定器，拥有模块化和网络性能的两大优 阅读全文
posted @ 2019-12-05 11:38 XYQ全哥 阅读(1171) 评论(0) 推荐(0)
React: React组件创建的三种方式
摘要：一、简介 在前面介绍的React组件知识中，对于组件的创建我只是用了其中某一种方式。其实，在2013年React诞生之初，对于React组件的创建，仅仅只有一种方式，也即createClass函数，在目前项目中使用率还是很高的。但随着后来技术更新，React组件创建的方式也在不断的变化和过时。到目前 阅读全文
posted @ 2019-12-04 14:13 XYQ全哥 阅读(1152) 评论(0) 推荐(0)
React: React的组件状态机制
摘要：一、简介 在React中，有两个核心的默认属性，分别是state和props。state会记录组件的状态，React根据状态的变化，会对界面做相应的调整或渲染。props则是数据流向属性，React通过props传递来实现父子组件之间的通信。本篇主要研究React的组件状态机制，在很多Web界面可以 阅读全文
posted @ 2019-11-29 18:02 XYQ全哥 阅读(586) 评论(0) 推荐(0)
React: React的复合组件
摘要：一、介绍 不论Web界面是多么的复杂，它都是由一个个简单的组件组合起来实现的，既然会创建一个简单的组件，那么复杂的组件就有了下手的切入点了。现在来实现一个简单的复合组件。一个颜色面板，一共三部分组成。顶部是颜色板，底部是色值标签，一个大的box将这两个组件组合起来。吾尚在学习阶段，所以demo及其简 阅读全文
posted @ 2019-11-29 14:21 XYQ全哥 阅读(425) 评论(0) 推荐(0)
React: 研究React的组件化
摘要：一、简介大概 在以往的Web开发中，会把web页面所有的复杂控件作为一个单一的整体进行开发，由于控件之间需要进行通信，因此不同的组件之间的耦合度会很多，由于开发一个控件的时候要考虑到控件与控件之间的联系，这么一来，随意一个复杂控件的代码思想就很复杂。ReactJS的出现，很好地解决了这个问题，Rea 阅读全文
posted @ 2019-11-26 16:34 XYQ全哥 阅读(1134) 评论(0) 推荐(0)
React: 认识React
摘要：一、简介 React-Native是Facebook开源的跨平台框架，用于实现前端和原生进行混合开发。React-Native开发可以很好的使用原生UI构建用户界面，与传统的使用WebView相比，不仅保留了原生的用户体验和流畅度，还提高了开发效率，React-Native的构建思路图如下。而Rea 阅读全文
posted @ 2019-11-24 15:42 XYQ全哥 阅读(367) 评论(0) 推荐(0)