我有一个自定义输入组件,如下所示:
import React, { useState, useCallback } from 'react'
function MyCustomInput ({value: initialValue = '0'}) {
const [value, setValue] = useState(initialValue)
const handleChange = useCallback(
value => {
setValue(value)
},
[setValue]
)
return (
<SomeInputComponent onChange={handleChange}/>
)
}
React中useCallback的实现
doc
说:
const memoizedCallback = useCallback(
() => {
doSomething(a, b);
},
[a, b]
)
现在根据doc的实施,正确的方法应该是:
const handleChange = useCallback(
value => {
setValue(value)
},
[value] // And not, [setValue]
)
但这会利用
useCallback
一文不值
handleChange
value
状态更新会导致不必要的重新提交我的
<SomeInputComponent>
组件。我的实现不正确吗?