时间戳

首页 > 解决方案 > 如何处理查询中字符串类型的打字稿错误

javascript - 如何处理查询中字符串类型的打字稿错误

问题描述

我有一个这样的查询：

document.querySelectorAll("h2, h3").forEach(header => {
    tmpNav.push({name: header.textContent || header.innerHTML, id: header.id, type: header.nodeName});
})

通过这个接口输入的内容：

interface IContent {
    name: string,
    id: string,
    type: "H3" | "H2"
}

我有一个循环遍历tmpNav数组并显示数据，在某些时候我使用来自的类型tmpNav插入基于它的类（jss）：

className={classes[type]}

我面临的问题是当我创建这个数组时，type: header.nodeName抛出一个类型错误，因为它返回一个与类型匹配的字符串type: "H3" | "H2"

添加它string会导致我classes[type]抛出错误，因为它与该类型不匹配。

我不确定该怎么做。我一直都知道数组会使用其中一种类型，header.nodeName因为它只是一个querySelectorfor "h2, h3"。

标签： javascripttypescript

解决方案

更合适的解决方案是使用条件值检查来缩小类型header.nodeName

if (header.nodeName === 'H3' || header.nodeName === 'H2') {
  tmpNav.push(...);
}

推荐阅读