在具有两个单独导出的钩子中使用 React State

发布于 2025-01-19 02:39:28 字数 503 浏览 0 评论 0原文

所以我创建了一个钩子，它将充当两个不同组件之间的桥梁。因此，第二个函数将获取第一个函数计算的数据并显示它们，但第一个函数实际上将返回显示数据的计数。

这些需要与状态连接，因为它们也应该在变化时更新，这些数据可以在第二个函数中删除。

所以我想做的是，我想在第二个函数中 setState 并在第一个函数中读出它。我现在的做法是行不通的，因为 useState 位于组件之外。

我如何在这两个函数中使用这个 useState ？

const [state, setState] = useState<string[]>([]);

export const thisUsesState = () => {
   return countOfArrayState;
}

export const thisUpdatesStateReturnsComponent = () => {
   return <Component></Component>;
}

原文

So i have created a hook which will act as a bridge between two different components.
So the second function will take the data that the first function calculates and display them, however the first function will actually return a count of the displayed data.

These need to be connected with a state, since they should also update on change, those data can be deleted in the second function.

So what i want to do is, i want to setState in the second function and read it out in the first one. The way i did it now it won't work, since the useState is outside of a component.

How can i use this useState in both of these functions?

const [state, setState] = useState<string[]>([]);

export const thisUsesState = () => {
   return countOfArrayState;
}

export const thisUpdatesStateReturnsComponent = () => {
   return <Component></Component>;
}

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

薆情海 2025-01-26 02:39:28

为函数制作父组件，您可以像魅力一样使用状态。

const Func: React.FC = () => {

const [state, setState] = useState<string[]>([]);

export const thisUsesState = () => {
   return countOfArrayState;
}

export const thisUpdatesStateReturnsComponent = () => {
   return <Component></Component>;
}
return something

}
export default Func

Make a parent component for both the function and you can use state like a charm.

const Func: React.FC = () => {

const [state, setState] = useState<string[]>([]);

export const thisUsesState = () => {
   return countOfArrayState;
}

export const thisUpdatesStateReturnsComponent = () => {
   return <Component></Component>;
}
return something

}
export default Func

回复收藏 0 原文

~没有更多了~