最近学习react redux,先前看过了几本书和一些博客之类的,感觉还不错,比如<深入浅出react和redux>,<React全栈++Redux+Flux+webpack+Babel整合开发>,<React与Redux开发实例精解>, 个人觉得<深入浅出react和redux>这本说讲的面比较全, 但是 很多都是蜻蜓点水, 不怎么深入.这里简单记录一个redux 的demo, 主要方便以后自己查看,首先运行界面如下: 项目结构如下: 这里我们一共有2个组…

|-----------------------------------------| | | | React & Redux | | | |-----------------------------------------| Project | |-- node_modules | | | |-- react | | | |-- react-dom | | | |-- react-router | | | |-- react-redux => redux本身只能处理同步的Action |…

一.搭建开发环境: webpack构建工具. 新建一个文件夹(login),进入根目录, 1.输入命令:cnpm init,生成了一个package.json文件,这是一个标准的npm说明文件,里面蕴含了丰富的信息,包括当前项目的依赖模块,自定义的脚本任务等等. 2.输入命令:cnpm install -g webpack //全局安装webpack 3.输入命令:cnpm install --save-dev webpack //本地安装webpack 4.输入命令:cnpm install…

引言 由于现在做的react-native项目没有使用到redux等框架,写了一段时间想深入学习react,有个想法想做个demo练手下,那时候其实还没想好要做哪一个类型的,也看了些动漫的,小说阅读,聚合资源的开源项目.但是由于正好在学习开源的Android小说阅读器--任阅,加上api比较全,开始边学边做,项目地址在这里,如果有好的意见欢迎提issue或pr. 效果图 目录结构 ├─actions #redux的action,业务逻辑 ├─components #页面容器 │ └─common…

来自一位美团大牛的分享,相信可以帮助到你. 原文链接:https://juejin.im/post/5948985ea0bb9f006bed7472?utm_source=tuicool&utm_medium=referral 前言   本文主要介绍facebook推出的一个类库immutable.js,以及如何将immutable.js集成到我们团队现有的react+redux架构的移动端项目中. 本文较长(5000字左右),建议阅读时间: 20 min 通过阅读本文,你可以学习到: 什么是i…

今天分享一个react应用,应在第一篇作品中说要做一个react+redux+xxx的应用.已经做完一部分,拿出来分享.github地址为:点我就可以咯~ 这里实现了一个新闻移动站的spa.本来想写pc端的,但是比较懒,而且因为主要是react的项目,关于css和布局的细节就是糊弄人的了.T.T,这里只说关于这个项目的js部分. 这里的功能很简单,有一下几点: 1,按”心“排序 当比上一个多了,就会排到前面. 2.评论部分 新闻的评论部分类似qq空间的评论 当然,也可以点击新闻回复的哦. ===…

曾经看到一篇文章,写的是jquery开发者吐槽angular的复杂.作为一个angular开发者,我来吐槽一下react+redux的复杂. 例子 为了让大家看得舒服,我用最简单的一个demo来展示react+redux的“弯弯绕”,下面这个程序就是我用react和redux写的.然而这个程序在angular中一行js都不用写!!! 展示组件 App.js import React, { findDOMNode, Component } from 'react'; import ReactDOM…

当我遇到问题: 要沉着冷静. 要管理好时间. 别被bug或error搞的不高兴,要高兴,又有煅炼思维的机会了. 要思考这是为什么? 要搞清楚问题的本质. 要探究问题,探究数据的流动. TodoList 1. 编写actions.js 分析state 试着拆分成多个reducer 3. 了解store 4. 了解redux数据流生命周期 5. 分析容器组件和展示组件 搞清楚,数据到底是如何流动的? 6. 编写展示组件的代码 7. 编写容器组件 8. 传入store 9. 其他 TodoList 脚…

TodoList 1. 编写actions.js 2. 分析state 试着拆分成多个reducer 3. 了解store 4. 了解redux数据流生命周期 5. 分析容器组件和展示组件 搞清楚,数据到底是如何流动的? 6. 编写展示组件的代码 7. 编写容器组件 8. 传入store 9. 总结 10. 参考 TodoList 脚手架Github地址 1. 编写actions.js 2. 分析state 试着拆分成多个reducer 3. 了解store store.getState() s…

先看效果图 github地址 github仓库 在线访问 初始化项目 #创建项目 create-react-app applist #如果没有安装create-react-app的话,先安装 npm install -g create-react-app 目录结构改造 |--config |--node_modules |--public |--scripts |--src |-----api //api接口 |-----components //组件 |-----pages //页面 |---…