React学习记录: Redux

发布时间:2019-08-05 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了React学习记录: Redux脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

入门
官网
React.js模仿大众点评webapp 实战教程(5)redux基础
React.js 小书

父向子孙传值用PRops

react子组件如何向父组件传值

react子组件如何向父组件传值

组件之间传值

redux实例

import { createstore } From 'redux'
export default function () {
// 下面这一段代码,就是 https://github.COM/reactjs/redux 中的入门demo


// 第一步:定义计算规则,即 reducer
//Store 收到 Action 以后,必须给出一个新的 State,这样 View 才会发生变化。这种 State 的计算过程就叫做 Reducer。
function @H_360_51@counter(state = 0, action) {
    switch (action.type) {
        case 'INCREMENT':
            return state + 1
        case 'DECREMENT':
            return state - 1
        default:
            return state
    }
}

// 第二步:根据计算规则生成 store
let store = createStore(counter)

// 第三步: 定义数据(即 state)变化之后的派发规则(根据数据变化定义监听的函数)
store.subscribe(() => {
    console.log('current state', store.getState())
})

// 第四步: 触发数据变化,即action发生变化,这里是action对象的type属性(type属性是必须有的)
store.dispatch({type: 'INCREMENT'})
store.dispatch({type: 'INCREMENT'})
store.dispatch({type: 'DECREMENT'})

}

Redux with React

chrome中两个开发插件
redux-devtools
react-devtools

脚本宝典总结

以上是脚本宝典为你收集整理的React学习记录: Redux全部内容,希望文章能够帮你解决React学习记录: Redux所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。