想同时具备 useSetState 合并对象、useResetState 重置状态的能力,有没有这样一个 hook?
个人理解:useSetState并没有提供reset这样类似的hook,但是可以变通解决
const [state, setState] = useSetState({
name: 'ice',
age: 24,
})
const resetState = useCallback(() => {
setState(() => state)
}, [])
resetState本质利用的是闭包,保存初始值即可,这里setState需要用回调函数的方式,因为在其源码中,如果是函数的方式,则把prevState传递出来,返回值我们自己控制,不然传递非函数的形式,会进行合并,或者返回上一次的状态。
@GetWebHB 其实就是我不想组合所以才问官方能不能提供 - -
如果要提供的话 我来pr好了
如果要提供的话 我来pr好了
可以来个 PR,感谢。直接给 useSetState 的返回值添加第三个参数,像这样:cosnt [val, setVal, resetVal] = useSetState(),注意处理初始值是随机值时的重置问题,可以参考:https://github.com/alibaba/hooks/pull/2308/files
第三个参数,改成一个对象,有利于第四个,第五个....参数的拓展。cosnt [val, setVal, { resetVal }] = useSetState()
感觉这个不太用纠结,状态其实也就那几个,反而个人觉得统一的风格更为重要,如果有后面在扩展即可
能把 getState也加进去么
@pangao66 getState可以麻烦给一个使用场景吗,state可以直接访问
@GetWebHB 就是 https://ahooks.js.org/zh-CN/hooks/use-get-state 把这个hook也合并进去, state默认拿的 不是最新的
@liuyib 元芳 你怎么看 有必要的话还是我来
@pangao66
getState可以麻烦给一个使用场景吗,state可以直接访问
const [count, setCount, getCount] = useGetState(0)
const foo = () => {
setCount(prev => prev + 1);
// 这里需要用 getCount 才能获取到最新值,用 count 的话是旧值
console.log(' -->', getCount(), count);
}
感觉有必要统一 useSetState, useGetState, useResetState 这几个 hook。
之前我第一次看到这几个 hook 时,也想过为什么不直接把它们合并起来。但其实这几个 hook 用的少,没遇到同时需要这几个 hook 的场景,就没继续深入了。
目前我想的是这样统一:
// 类似于类组件的状态,扩展了 getState, resetState
const [state, setState, { getState, resetState }] = useSetState();
// 等价于 useState,扩展了 getState, resetState
const [state, setState, { getState, resetState }] = useGetState();
但这样 useGetState 就 breaking changes 了(第三个返回值类型变了)估计要放在 v4 做了
感觉有必要统一 useSetState, useGetState, useResetState 这几个 hook。
之前我第一次看到这几个 hook 时,也想过为什么不直接把它们合并起来。但其实这几个 hook 用的少,没遇到同时需要这几个 hook 的场景,就没继续深入了。
目前我想的是这样统一:
// 类似于类组件的状态,扩展了 getState, resetState const [state, setState, { getState, resetState }] = useSetState(); // 等价于 useState,扩展了 getState, resetState const [state, setState, { getState, resetState }] = useGetState();
@li-jia-nan @hchlq @miracles1919 @crazylxr 哥哥们,看下这样可以吗?
但这样 useGetState 就 breaking changes 了(第三个返回值类型变了)估计要放在 v4 做了
可以换个名字 弄一个新的呢 比如useBetterState呢, 这样就不用breakingChange了, 也能把这几个hooks 融合在一起, 原来的那几个分开用也行
感觉有必要统一 useSetState, useGetState, useResetState 这几个 hook。 之前我第一次看到这几个 hook 时,也想过为什么不直接把它们合并起来。但其实这几个 hook 用的少,没遇到同时需要这几个 hook 的场景,就没继续深入了。 目前我想的是这样统一:
// 类似于类组件的状态,扩展了 getState, resetState const [state, setState, { getState, resetState }] = useSetState(); // 等价于 useState,扩展了 getState, resetState const [state, setState, { getState, resetState }] = useGetState();@li-jia-nan @hchlq @miracles1919 @crazylxr 哥哥们,看下这样可以吗?
我觉得可以的哈,比较统一,可以在 v4 中做
可以换个名字 弄一个新的呢 比如useBetterState呢
可以换个名字,来个新 hook。但是众所周知,起名字是计算机难题 :)
这个 useGetState 换个什么名字好呢,来出出主意:
-
useBetterState -
useSuperState -
useProState -
usePlusState -
useUltraState -
useMixState -
useGetResetState - ......
👀 👀
我甚至想把 useSetState 和 useGetState 也和成一个 hook
const [state, setState, { getState, resetState, setObjectState }] = useProState();
setObjectState(这个名称可以换) 用于替代 useSetState
这样用户的心智就是反正用 state,都用 useProState,不用记那么多 hook
然后就是那些 useEffect 也有很多可以合并的,很多 hook 绝大部分情况下用不到,比如那些 deep,我希望的尽量少的 hook,hook 的功能强大一点,使用者心智会简单一点
这个
useGetState换个什么名字好呢,来出出主意:
useBetterStateuseSuperStateuseProStateusePlusStateuseUltraStateuseMixStateuseGetResetState- ......
👀 👀
useSmartState 或者 useBetterState 不错 @liuyib
我甚至想把 useSetState 和 useGetState 也和成一个 hook
const [state, setState, { getState, resetState, setObjectState }] = useProState();
我也感觉这俩合成一个挺不错的,但是下面这种情况是不是反而麻烦了点:
const [state, setState] = useSetState();
// 等价于上面的代码,但是第二项用不到
const [state, _, { setObjectState: setState }] = useProState();
我甚至想把 useSetState 和 useGetState 也和成一个 hook
const [state, setState, { getState, resetState, setObjectState }] = useProState();我也感觉这俩合成一个挺不错的,但是下面这种情况是不是反而麻烦了点:
const [state, setState] = useSetState(); // 等价于上面的代码,但是第二项用不到 const [state, _, { setObjectState: setState }] = useProState();
那感觉可以把 setState 放到第二项里,第二项里全部是方法
我从vue转过来的,原生react那几个api不好用,看了下ahooks确实眼前一亮,看到state也想为什么不合并,set和 get还有reset,不管怎么说ahooks在react生态中我认为是最好的hooks三方库
ok, 交给我吧~, 另外useSetState和useGetState打算移除吗 如果不打算移除,我直接import进来了
const [state, { setState, getState, resetState, setObjectState }] = useProState();
ok, 交给我吧~, 另外
useSetState和useGetState打算移除吗 如果不打算移除,我直接import进来了const [state, { setState, getState, resetState, setObjectState }] = useProState();
重新写一个吧。后面肯定会移除的的。