Question

所以我们开始尝试Typescript。我在Vue中自动全局组件注册时可以查看此功能。老实说，我不知道如何在Typescript中进行翻译。这是fileName函数中的camelCase(fileName.split('/'))。

import upperFirst from 'lodash/upperFirst'
import camelCase from 'lodash/camelCase'


// other code

requireComponent.keys().forEach(fileName => {
  const componentConfig = requireComponent(fileName)

  // here
  const componentName = upperFirst(
    camelCase(
      fileName
        .split('/')
        .pop()
        .replace(/\.\w+$/, '')
    )
  )

  Vue.component(
    componentName,
    componentConfig.default || componentConfig
  )
})

打字稿错误TS2532：对象可能是“未定义”

Answer 1

pop返回string | undefined，因此您可以将其保存在变量中以检查undefined或加粗并声明将始终使用!进行定义：

  fileName
    .split('/')
    .pop()!
    .replace(/\.\w+$/, '')

（实际上并不是那么粗体，因为拆分空字符串将始终至少返回包含该空字符串的数组，因此pop应该解析为一个元素。）

可变支票看起来像这样：

const last = fileName
    .split('/')
    .pop();
if (last == undefined)
    throw Error("This has never happened before.")

// Compiler now will 'know' that last is a string.
camelCase(last.replace(/\.\w+$/, ''));

在另一个函数中使用时，变量可能未定义（打字稿“错误TS2532”）

1 个答案: