Question

我在Vue Class组件中使用props。道具在构造函数中定义，没有值。这编译并正常工作，但自从最新的VS Code / TSLint更新后，我收到以下警告：

属性'tag'没有初始值设定项，并且在构造函数中没有明确赋值。

Vue类组件

export default class Browser extends Vue {
  @Prop({default: '', required:false})
  tag: string

  created(){
     console.log("the tag prop is " + this.tag)
  }
}

如果我分配它，我会收到Vue警告，你不应该操纵子组件中的Prop。

[Vue警告]：避免直接改变道具，因为只要父组件重新渲染，该值就会被覆盖

由于这似乎主要是一个linting问题，有没有办法禁用它？或者我的代码实际上是错的？

Answer 1

您不需要即可设置strictPropertyInitialization": false来解决此问题。

根据Microsoft TypeScript-Vue-Starter存储库中的this link：

属性是通过在实例变量之前添加前缀来定义的来自vue-property-decorator包的@Prop（）装饰器。因为 --strictPropertyInitialization选项已启用，我们需要告诉TypeScript Vue将通过添加！来初始化我们的属性。至他们。这告诉TypeScript：“嘿，放松，有人要为该属性分配一个值。“

您只需要附加！命名：

@Prop({default: '', required:false})
  tag!: string

Answer 2

我有同样的问题。我通过将"strictPropertyInitialization": false,添加到tsconfig.json的compilerOptions来修复它。

{
    "compilerOptions": {
        "outDir": "./built/",
        "sourceMap": true,
        "strict": true,
        "noImplicitReturns": true,
        "experimentalDecorators": true,
        "module": "es2015",
        "moduleResolution": "node",
        "target": "es5",
        "strictPropertyInitialization": false,
        "lib": [
            "es5",
            "es2015",
            "dom",
            "ScriptHost"
        ]
    },
    "include": [
        "./src/**/*"
    ]
}

Vue Prop没有初始值设定项，并且未在构造函数

2 个答案: