用redux有一段时间了，感觉还是有必要把其相关的知识点系统的总结一下的，毕竟好记性不如烂笔头。上篇博客更新了关于《ES6中的迭代器、Generator函数以及Generator函数的异步操作》的内容，该内容时saga的基础，稍后会总结saga相关知识点。循序渐进，本篇博客主要总结的是Redux相关的内容，然后下篇博客打算总结一下react-redux, 以及redux-thunk、redux-saga中间件。 一、Redux与iOS中的Notification的比较Redux 的功能和作用就是...
组件是 React 的核心，因此了解如何利用它们对于创建优秀的设计结构至关重要。什么是组件根据 React 官网的介绍，“组件让你可以将 UI 分割成独立的、可重用的部分，并独立管理每个部分。”当你第一次安装 npm install react 时，会得到一件事:组件及其 API。与 JavaScript 函数类似，组件接受名为 “props” 的输入并返回 React 元素，该元素描述(声明)用户界面(UI)的外观。这就是为什么 React 被称为声明性 API，因为你告诉它你希...
概览React 是一个声明式，高效且灵活的用于构建用户界面的 JavaScript库。可以将一些简短、独立的代码片段组合成复杂的UI界面，这些片段被称为“组件”。React 大体包含下面这些概念：组件JSXVirtual DOMData Flow组件可以将UI 拆分为独立且复用的代码片段，每部分都可独立维护。 组件，从概念上类似于 JavaScript 函数。它接受任意的参数（即 “props”），并返回用于描述页面展示内容的React 元素。 自定义组件命名：必须以大写字...
做项目遇到一个百度地图api 的跨域问题。由于使用fetch ，在调用类似http://api.map.baidu.com/geocoder/v2/callback=renderReverse&location=39.983424,116.322987&output=json&pois=1&ak=您的ak 的时候，不可避免的出现了跨域问题。 fetch(baseUrl + ‘location=39,116&output=json&ak=您的ak&callback=showLocation‘,{mode:‘no-cors‘,// credentials: ‘include‘,headers:{ Accept: ‘application/json‘,}}).t...
前奏这篇文章仅对不熟悉在react中使用socket.io的人、以及websocket入门者有帮助。下面这个动态图展示的聊天系统是用react+express+websocket搭建的，很模糊吧，要得就是这样的效果，我自己开了2个窗口，创建2个用户自问自答。没有什么高深的技术，对于很多想接触websocket的前端工程师来说，不擅长后端的websocket代码可能是硬伤。开发环境服务端：express服务器客户端：react技术栈，开发环境采用前端服务器的方式，打包后将静态...
react+redux构建淘票票首页描述 在之前的项目中都是单纯的用react，并没有结合redux。对于中小项目仅仅使用react是可以的；但当项目变得更加复杂，仅仅使用react是远远不够的，我们需要将UI渲染和数据处理区分开，因此我们需要引入redux来管理数据层。写该小demo的目的主要是为了在理论学习的基础上更好的进行实践，通过自己亲手写个小项目我们才能更好的理解redux是如何管理数据层的。数据是取自淘票票官方二月份的部分数据。技术...
根据rantd搭建项目：1、引入react项目无样式。 解决：2、model按需加载。 解决： 原文：https://www.cnblogs.com/na-w/p/11264483.html
最近写React一直在纠结样式的问题，今天找了篇看起来很不错的文章，认真读三遍先...原文链接：https://juejin.im/post/5b39e63ae51d4562aa017c81React拾遗：从10种现在流行的 CSS 解决方案谈谈我的最爱 （中）上篇 介绍了 React 现在流行的 CSS 解决方案。本篇就直接进入主题详细讲讲我最喜欢的解决方式之一：tachyons个人认为，tachyons 适合小的、样式不是重点的项目以及写 Demo， 但这不代表不能用 tachyons 完成大项目和漂亮的...
react绑定属性/* react绑定属性注意：class要换成classNamefor要换成 htmlForstyle:<div style={{"color":‘red‘}}>我是一个红的的 div 行内样式</div>其他的属性和以前写法是一样的*///组件名称首字母大写、组件类名称首字母大写class Home extends React.Component{// 子类必须在constructor方法中调用super方法，否则新建实例时会报错。这是因为子类没有自己的this对象，而是继承父类的this对象，然后对其进行加工。如果不调用...
1. BrowserRouter 与 HashRouter最显著的区别是，HashRouter的URL中含#，例如：http://example.com/#/your/page2. Link 与 NaviLink 在页面中都会以<a></a>的形式渲染出来。<NavLink to="/react" activeClassName="hurray">React </NavLink>NaviLink是一种特殊的Link, 当URL为to属性的值时，其style为activeClassName中指定的样式。3. webpack内置就支持code splitting, 但要使用babel（将JSX编译为JavaScript）时，需安装 @babel/...
REST API通常用于Web开发中。它们是Web应用程序用来彼此“交谈”的编程接口。它们用于访问功能部件和数据。“ REST”（代表性状态转移）是定义API属性的概念。本文将重点介绍如何使用基于Web的API从数据库中检索数据。 Axios是一个npm软件包，允许应用程序将HTTP请求发送到Web API。要在您的React应用程序中使用Axios，请使用以下命令：npm install axios要么yarn add axios在创建react组件之前，请按照以下步骤将React和Axios导入...
一、admin页面布局及路由创建0）cmd批量创建目录及子目录//创建各个目录，及charts和子目录bar md home category product role user charts\bar charts\line charts\pie 或 mkdir home category product role user charts\bar charts\line charts\pie目录结构│ admin.jsx │ ├─category ├─charts │ ├─bar │ ├─line │ └─pie ├─header │ header.less │ index.jsx │ ├─home ├─left │ in...
当通过createClass创建了组件之后，该React组件就有了生命周期。通常一个React组件的生命周期可分为三个阶段：Mounting：挂载组件，也就是组件实例化ReciveProps：存在期，在这个时期组件的props和state会变化，重新渲染组件Unmounting：卸载组件，也就是组件被销毁 React在生命周期中提供了10种API： 1.getDefaultProps()：作用于组件类，只调用一次，返回对象用于设置默认的props，对于引用值，会在实例中共享。 2.getI...
react native 热更新的好处js脚本代码改变了，比如对ui进行了一些修改，客户端要是想更新的话，如果直接下载apk 或者ipa,一个是浪费流量，还有比较麻烦热更新只要下载打包好的bundle 文件，然后进行替换就可以了思路比较简单，客户端跟服务端都维持 一个bundle版本信息，如果服务端的版本比客户端的 版本新就下载，然后替换掉 重新渲染就OK了具体实现，如果没有 热更新，载入bundle的代码是这样的jsCodeLocation = [[RCTBundleURLP...
刚写好的文章一不小心点错界面被覆盖掉，那种心情真tm酸爽，好了都怪自己不小心。发完牢骚还是要继续重来。在介绍react之前首先要说说为什么用它。我最初发现他时在material ui这个前端实现框架里面。这个框架的实现使用的正式react,react是由facebook 工程师提出来的前端组件化思想的实现。前端组件化的思想出现是因为大型项目需求的刺激。为了优雅的实现大型项目，我们必须把它一块一块的分离出来再去实现。这里给大家一篇关于探...