先看一下使用 redux 的元件小范例:
import {createStore} from 'redux'
import {reducer} from './redux-reducer'
const store = createStore(reducer)
export {store}
const initialState = {count: 0}
function reducer(state = initialState, action) {
switch (action.type) {
case 'INCREMENT':
return {
count: state.count + 1,
}
case 'DECREMENT':
return {
count: state.count - 1,
}
default:
return state
}
}
export {reducer}
import React from 'react'
import {useSelector, useDispatch} from 'react-redux'
function Counter() {
const count = useSelector(state => state.count)
const dispatch = useDispatch()
const increment = () => dispatch({type: 'INCREMENT'})
const decrement = () => dispatch({type: 'DECREMENT'})
return (
<div>
<h2>Counter</h2>
<div>
<button onClick={decrement}>-</button>
<span aria-label="count">{count}</span>
<button onClick={increment}>+</button>
</div>
</div>
)
}
export {Counter}
P.S. 呜呜,先发文再补完
<<: [Day 28] 社会对人工智慧的期待与影响 Society Concern and Impact
>>: Day28 | 获取安装的extension进行操作
藉着 Day 14 建一个 Node.js 容器 所建立的基底,来制作一个 Image 并上传到 D...
昨天,提供了一种CSS命名的方法, 今天,我们再来看看有什麽要避免的CSS命名呢? 避免直接把颜色放...
Portal为不产生parent节点的情形下,将children渲染到DOM节点上面的方法。起手的宣...
ㄧ. 前言 前面有说明如何运用TFIDF与BOW来表示一个句子/文本的表示方式,但若以BOW这样的方...
接下来让我们开始熟悉 Git 的操作流程。 使用 Git 的时候,我们会常看见以下四个指令: git...