我在 vue.js 3 + typescript 中有这段代码,我只想在数据中声明一个对象数组,但弹出几个错误
- ...loading
id、正文、用户名和点赞类型“number”或“string”不可分配给“never”类型。ts(2322) 因为在数据中,当声明具有空数组的项目时,它说 property:never 并且我想声明如下内容: {id:number, body:string,username:string, likes:number}[]
如果不正确,使用打字稿处理此声明的正确方法是什么,或者我可能需要配置 tsconfig.json 或其他内容
提前致谢 哦,该应用程序运行良好!!
这是我的 tsconfig.json:
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"moduleResolution": "node",
"experimentalDecorators": true,
"skipLibCheck": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"forceConsistentCasingInFileNames": true,
"useDefineForClassFields": true,
"sourceMap": true,
"baseUrl": ".",
"types": [
"webpack-env"
],
"paths": {
"@/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules"
]
}
这是我的 vue.config.js
const { defineConfig } = require('@vue/cli-service')
module.exports = defineConfig({
transpileDependencies: true
})
我的巴贝尔配置
module.exports = {
presets: [
'@vue/cli-plugin-babel/preset'
]
}
我的 shims-vue.d.ts
/* eslint-disable */
declare module '*.vue' {
import type { DefineComponent } from 'vue'
const component: DefineComponent<{}, {}, any>
export default component
}
和我的 .eslintrc.js
module.exports = {
root: true,
env: {
node: true
},
'extends': [
'plugin:vue/vue3-essential',
'eslint:recommended',
'@vue/typescript/recommended'
],
parserOptions: {
ecmaVersion: 2020
},
rules: {
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off'
}
}
只是带vue create app-name的默认配置
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
提前使用类型定义项目数组应该可以修复 TypeScript 错误。像这样的东西应该有效:
items: [] as { id: number, body: string, username: string, likes: number }[]