比如说,购物车计算总价(总价 = 购物车商品总价 - 优惠券满减),优惠券是根据购物车内商品数量或者选中的商品类型决定的。。。这样的话给总价使用useMemo
的时候,依赖的数组就是[选中商品总价,优惠券]
,我使用useEffect
监听选中商品变化,在useEffect
里更改优惠券,这样的话优惠券改变和选中商品改变会让总价useMemo
执行多次???如何避免重复执行两次呢?
const [ x, setX ] = useState(true) // 假设这是选中商品
const [ y, setY ] = useState(false) // 假设这是优惠券
useEffect(() => { // 渲染后执行
if (x) { // 选中商品后更改优惠券
setY(false)
} else {
setY(true)
}
}, [x])
const toggle = () => { // 更改选中商品
setX(!x)
}
// 计算得到总价~~~~
const xy = useMemo(() => { // 渲染中执行
console.log('useMemo') // toggle执行,这里会执行两次console
return x + '|' + y
}, [x, y])