Reactjs 通过setState或从自定义挂钩（React）返回状态值的最佳方法是哪一种

我想知道在react中使用自定义挂钩时，这两种方法中哪一种最适合处理状态

在阅读了编写可测试的react钩子之后，我开始拥有一个与组件关联的定制钩子，作为状态和业务逻辑的单一入口点

然而，这让我想知道哪种方法最适合处理状态。我应该保留很多状态值并将setState操作传递给其他自定义钩子，还是应该返回一个值并让更具体的钩子处理更具体的状态？我已经做了一个基本的例子来说明我想要表达的东西

// useMyComponent.ts

// Approach 1

export default (): {
  foo: string;
} => {
  const [foo, setFoo] = useState < string | undefined>();

  // State contained within this custom hook
  const [authorisedInfo, setAuthorisedInfo] = useState<string | undefined>();
  const [googleToken, setGoogleToken] = useState<string | undefined>();
  useEffect(() => {
    // setState passed down and set within a different custom hook
    useSignInWithGoogle(setGoogleToken);
  }, []);
  useEffect(() => {
    if (!googleToken) return;
    usePerformAuthCall(setAuthorisedInfo);
  }, [googleToken]);

  useEffect(() => {
    if (!authorisedInfo || !googleToken) return;
    const { foo } = doSomethingHere(authorisedInfo, googleToken);
    setFoo(foo);
  }, [authorisedInfo, googleToken]);

  return { foo };
};

// Approach 2

export default (): {
  foo: string;
} => {
  const [foo, setFoo] = useState < string | undefined>();

  useEffect(() => {
    // state value passed back from the custom hook
    const { googleToken } = useSignInWithGoogle();
  }, []);
  useEffect(() => {
    if (!googleToken) return;
    const { authorisedInfo } = usePerformAuthCall(setAuthorisedInfo);
  }, [googleToken]);

  useEffect(() => {
    if (!authorisedInfo || !googleToken) return;
    const { foo } = doSomethingHere(authorisedInfo, googleToken);
    setFoo(foo);
  }, [authorisedInfo, googleToken]);

  return { foo };
};

//使用mycomponent.ts
//方法1
导出默认值（）：{
foo:string；
} => {
const[foo，setFoo]=useState（）；
//此自定义挂钩中包含的状态
const[authorizedInfo，setauthorizedInfo]=useState（）；
const[googleToken，setGoogleToken]=useState（）；
useffect（（）=>{
//setState向下传递并在不同的自定义挂钩中设置
使用谷歌（setGoogleToken）登录；
}, []);
useffect（（）=>{
如果（！googleToken）返回；
使用PerformAuthCall（设置授权信息）；
}，[googleToken]）；
useffect（（）=>{
如果（！authorizedInfo | |！googleToken）返回；
const{foo}=doSomethingHere（授权信息，谷歌代币）；
setFoo（foo）；
}，[授权信息，谷歌代币]；
返回{foo}；
};
//方法2
导出默认值（）：{
foo:string；
} => {
const[foo，setFoo]=useState（）；
useffect（（）=>{
//从自定义挂钩传回的状态值
const{googleToken}=useSignInWithGoogle（）；
}, []);
useffect（（）=>{
如果（！googleToken）返回；
const{authorizedInfo}=使用性能调用（setauthorizedInfo）；
}，[googleToken]）；
useffect（（）=>{
如果（！authorizedInfo | |！googleToken）返回；
const{foo}=doSomethingHere（授权信息，谷歌代币）；
setFoo（foo）；
}，[授权信息，谷歌代币]；
返回{foo}；
};

谢谢你的帮助