redux精品先导课程
jiaojsun
做一只快乐的小码龙
展开
-
redux精品先导课程—01初始redux
1.基础 学习redux之前需要掌握以下知识 2.redux知识结构 3.实际操作 打开daily项目,进行 ① npm i ② node ser 然后可以运行起来了,自动打开一个http://localhost:9000/的页面 先大概看一下代码 import { createStore } from 'redux'; function counter(stat...原创 2019-03-09 14:20:10 · 103 阅读 · 0 评论 -
redux精品先导课程—02redux基本概念
1.相关概念 action store.dispatch({ type: 'INCREMENT' , value: 6 }); // 相当于action reducer reducer是一个纯函数,即确定的输入和确定的输出。也没有副作用,比如说不请求其他的东西 state 可以是任意的数据类型 关于state,需要注意下面一点 现在把state改成一个引用类型如下所示...原创 2019-03-09 14:56:47 · 123 阅读 · 0 评论 -
redux精品先导课程—03计数器-DOM版本
实现的代码 let $addCounter = $('.counterBox .addCounter'); let $counterPanrl = $('.counterBox .counterPanel'); let $hasAll = $('.allSel .val'); let $maximum = $('.maximum .val'); let $allCount = $('.allC...原创 2019-03-09 16:33:17 · 105 阅读 · 0 评论 -
redux精品先导课程—04计数器-redux版本
import { createStore } from 'redux'; let $addCounter = $('.counterBox .addCounter'); let $counterPanrl = $('.counterBox .counterPanel'); let $hasAll = $('.allSel .val'); let $maximum = $('.maximum ....原创 2019-03-09 17:29:07 · 115 阅读 · 0 评论 -
redux精品先导课程—04action创建函数
可以将上一节的代码进行优化 还可以继续优化原创 2019-03-09 17:49:31 · 171 阅读 · 0 评论 -
redux精品先导课程—07react手动连接
还是上一节的项目,首先安装以下依赖库。 npm i -S react react-dom npm i -D prop-types babel-preset-react 接着使用node ser帮项目跑起来。 然后添加预设 在index.html添加以下代码 首先把ui绘制好。 reducer/index.js let initState = { ...原创 2019-03-19 15:20:06 · 137 阅读 · 0 评论 -
redux精品先导课程—06combinereducers
上一节我们讲的是只有一个面板的,现在我们要变成两个面板,要怎么操作呢? 首先index.html里面的ui代码先复制一份 counter函数也做这样的变化 counters函数做以下改变 继续改写 现在我们引入combinereducers ...原创 2019-03-15 09:19:33 · 118 阅读 · 0 评论 -
redux精品先导课程—05redux-thunk中间件
首先安装redux-thunk这个插件 npm i -S redux-thunk 然后再重启服务器:node ser 首先执行下面操作,激活thunk \ 然后添加这些代码 完整代码如下所示 import { createStore, applyMiddleware } from 'redux'; import thunk from 'redux-t...原创 2019-03-11 10:08:08 · 147 阅读 · 0 评论 -
redux精品先导课程—08使用react-redux连接
首先安装这个库 npm i -S react-redux,然后用node ser跑起服务器 下面将上一节的代码进行改变 App.js require('style/main.scss'); import * as React from 'react'; // require('component/demo.js'); // require('component/counterByRed...原创 2019-03-21 10:28:29 · 120 阅读 · 0 评论