如何从带有变量的联合类型中选择类型

时间:2019-06-21 05:26:53

标签: typescript

我有这样的类型

type CreateOrUpdateMutationResult = { createArticle: boolean } | { updateArticle: boolean }

参数result是类型CreateOrUpdateMutationResult

我还有一个额外的变量isCreate,可以判断结果类型

但是如何让打字稿知道结果的实型?

// here ts don't know the result type
const status = isCreate ? result.createArticle : result.updateArticle

我希望ts知道结果的类型

2 个答案:

答案 0 :(得分:1)

如果知道是什么类型,可以使用as转换使其正确。

interface CreateMutationResult { createArticle: boolean }
interface UpdateMutationResult { updateArticle: boolean }
type CreateOrUpdateMutationResult = CreateMutationResult | UpdateMutationResult

然后

const status = isCreate ? (result as CreateMutationResult).createArticle : (result as UpdateMutationResult).updateArticle

答案 1 :(得分:0)

对此的解决方案很少:

您可以测试唯一键,

<div style="" class="icon_bar">
   <ul style="padding:0 ; margin : 0;display:flex; justify-content: center;">
      <li  onclick="display_specs()">
         <a href="#" >
            <div style="display:flex;align-items:center;flex-direction:column">
               <div style="height:35px;width:35px;padding:5px"> <img src="/static/phone.bmp" style="max-width:100%;height:auto"></div>
               <div style="padding:5px"  > Mobile</div>
            </div>
         </a>
      </li>
   </ul>
</div>

当您测试仅存在一种类型的密钥时,打字稿能够根据其推断类型。

或者您可以使用Typeguard,

const status = 'createArticle' in result ? result.createArticle : result.updateArticle;

您可以看到function isCreateResult(result: CreateOrUpdateMutationResult, isCreate: boolean): result is { createArticle: boolean } { return isCreate; // or 'createArticle' in result } const status = isCreateResult(result, isCreate) ? result.createArticle : result.updateArticle 标志并不是真正需要的,因为javascript允许以惯用的方式测试键。