返回联合类型中的一个承诺。

huangapple
go评论109阅读模式
英文:

Return promise of one of the union type

问题

component_one_setup 返回 Promise<boolean>，而 component_two_setup 返回 Promise<InitResult>。两者都调用了一个接受 boolean 或 InitResult 类型的 resolve 的方法。但 TypeScript 抛出了以下错误：

  1. Type '(value: boolean | PromiseLike<boolean>) => void' is not assignable to type '(value: ResolveParams) => void'.
英文:

I have got this code base whereby I am getting TS error. Can someone please help?

  1. export type InitResult = {canInit: boolean; reason: string}
  2. export type ResolveParams = InitResult | boolean
  4. export function selectMethod(
  5.   payload: {resolve?: (value: ResolveParams) =&gt; void} = {},
  6. ): void {
  7.   //
  8.   return undefined
  9. }
  11. const component_one_setup = (): Promise&lt;boolean&gt; =&gt;
  12.   new Promise(resolve =&gt; {
  13.     // ts error:  Type &#39;(value: boolean | PromiseLike&lt;boolean&gt;) =&gt; void&#39; is not assignable to type &#39;(value: ResolveParams) =&gt; void&#39;.
  14.     selectMethod({resolve})
  15.   })
  17. const component_two_setup = (): Promise&lt;InitResult&gt; =&gt;
  18.   new Promise(resolve =&gt; {
  19.     // ts error:  Type &#39;(value: InitResult | PromiseLike&lt;InitResult&gt;) =&gt; void&#39; is not assignable to type &#39;(value: ResolveParams) =&gt; void&#39;
  20.     selectMethod({resolve})
  21.   })

component_one_setup returns Promise&lt;boolean&gt; and component_two_setup returns Promise&lt;InitResult&gt;. Both are calling a method that would accept resolve of boolean or InitResult.
But Typescript is throwing error:

  1. Type &#39;(value: boolean | PromiseLike&lt;boolean&gt;) =&gt; void&#39; is not assignable to type &#39;(value: ResolveParams) =&gt; void&#39;

答案1

得分: 1

Convert the selectMethod function to a TS generic function.

  1. export type InitResult = { canInit: boolean; reason: string };
  3. export function selectMethod<Resolve extends (value: any) => void>(payload: { resolve?: Resolve }): void {
  5.   payload.resolve?.(true)
  6.   // or
  7.   payload.resolve?.({ canInit: false, reason: 'a' })
  9.   return undefined
  10. }
  12. const component_one_setup = (): Promise<boolean> => new Promise((resolve) => {
  13.   selectMethod({ resolve })
  14. });
  16. const component_two_setup = (): Promise<InitResult> => new Promise((resolve) => {
  17.   selectMethod({ resolve })
  18. });

TS Playground

英文:

Convert the selectMethod function to a TS generic function.

  1. export type InitResult = { canInit: boolean; reason: string };
  4. export function selectMethod&lt;Resolve extends (value: any) =&gt; void&gt;(payload: { resolve?: Resolve }): void {
  6.   payload.resolve?.(true)
  7.   // or
  8.   payload.resolve?.({ canInit: false, reason: &#39;a&#39; })
  10.   return undefined
  11. }
  13. const component_one_setup = (): Promise&lt;boolean&gt; =&gt; new Promise((resolve) =&gt; {
  14.   selectMethod({ resolve })
  15. });
  17. const component_two_setup = (): Promise&lt;InitResult&gt; =&gt; new Promise((resolve) =&gt; {
  18.   selectMethod({ resolve })
  19. });

TS Playground

答案2

得分: 0

我通过修改如下代码成功解决了上述问题：

  1. export type InitResult = { canInit: boolean; reason: string };
  2. export type ResolveParams = InitResult | boolean;
  3. export type ResolveFunction = (value: InitResult | boolean) => void;
  5. export function selectMethod(payload: { resolve?: ResolveFunction } = {}): void {
  6.   //
  7.   return undefined;
  8. }
  10. const component_one_setup = (): Promise<boolean> => new Promise((resolve) => {
  11.   selectMethod({ resolve: resolve as ResolveFunction });
  12. });
  14. const component_two_setup = (): Promise<InitResult> => new Promise((resolve) => {
  15.   selectMethod({ resolve: resolve as ResolveFunction });
  16. });

工作示例

  2. <details>
  3. <summary>英文:</summary>
  5. I managed to solve above issue by modifying the code as below:

export type InitResult = {canInit:boolean; reason:string};
export type ResolveParams = InitResult | boolean;
export type ResolveFunction = (value:InitResult | boolean)=>void;

export function selectMethod(payload: { resolve?: ResolveFunction} = {}): void {
//
return undefined
}

const component_one_setup = (): Promise<boolean> => new Promise((resolve) => {
selectMethod({ resolve: resolve as ResolveFunction })
});

const component_two_setup = (): Promise<InitResult> => new Promise((resolve) => {
selectMethod({ resolve: resolve as ResolveFunction })
});

  2. [working example][1]
  5.   [1]: https://www.typescriptlang.org/play?ssl=16&amp;ssc=4&amp;pln=1&amp;pc=1#code/KYDwDg9gTgLgBDAnmYcCSA7AljASsAZwFcAbeAXjjgG8BjAQw0xwC4AjCCE4Rgbjig8CEDCwIwoWDAHMAvrwBQoSLATJU%20YSQBuwAAr0o9ALYE4lZnkKl4AHzgcuPDIuXR4SFHE1ddAMSIMWhgsEXM4AAptehIiYBZLTRs4e0duRgBKcgA%20bQgsABNFJXB3OAAzQODQjDgCYG5ggFlgGAALCAKIsHpEEgh6ApYaAUJfYAB%20YZ8dYACgkJFZcOpZDOG8wpoFOAB6XZ3BGCIoWsCC4HKpYAKFWQUFWhFxOCfjSAxgDBgAfRFgH71Y5gcIRdZwPRQCDGLD1AA8aWc2XMyM%20AHcIVCYfUIhFBFpdBkUds6g1gM1Wh0utRRgT4rTxnB6GYZv4qotams7hlik8MC83h8vr8YGiIIDWkQQZQwcNIdDYcA4YlrGRkTk4OjMQqcXixrMiRrqDtSY0YC12p0IjT8eNhrbZkyWfq2QsanAuWteEA
  7. </details>

huangapple
  • 本文由 发表于 2023年6月8日 16:09:43
  • 转载请务必保留本文链接：https://go.coder-hub.com/76429852.html
  • javascript
  • react-typescript
  • typescript
匿名

发表评论

匿名网友

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen:

确定