react的useEffect第⼆个参数
useEffect第⼆个参数可以是普通类型、也可以是引⽤类型。
如果是从props接收来的值，是引⽤类型的，且是immutable类型的，不要在mapStateToProps⾥使⽤toJS，如下：const mapStateToProps = (state) => {
return {
count: In(['light', 'count']),
router: In(['light', 'router']).toJS(),
}
}
要在组件⾥使⽤：
import React, { useEffect } from 'react'
import { connect } from 'react-redux'
import { withRouter } from 'react-router-dom'
function Test(props) {
const { count, router } = props
const handleAdd = () => {
}
const handleRouter = () => {
const myRouter = JS()
myRouter.push({
id: w()
})
}
useEffect(() => {
console.log('count发⽣变化', count)
}, [count])
useEffect(() => {
console.log('router发⽣变化', JS())
}, [router])
return (
<div>
<div>{count}</div>
<button onClick={() => handleAdd()}>加</button>
<button onClick={() => handleRouter()}>改变router</button>
</div>
)
}
const mapStateToProps = (state) => {
return {
count: In(['light', 'count']),
router: In(['light', 'router']),
}
}
const mapDispatchToProps = (dispatch) => {
return {
onSetState(key, value) {
dispatch({ type: 'SET_LIGHT_STATE', key, value })
},
onDispatch(action) {
dispatch(action)
},
}
}
export default connect(mapStateToProps, mapDispatchToProps)(withRouter(Test))
react router6
light.js:
import { fromJS } from 'immutable'
const defaultState = fromJS({
count: 1,
router: []
})
const reducer = (state = defaultState, action) => {
switch (pe) {
case 'SET_LIGHT_STATE':
return state.setIn(action.key, fromJS(action.value))    default:
return state
}
}
export default reducer

版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。