'this' es-lint 错误的意外使用，禁用什么规则？

Question

我正在使用配置有 el-lint 和更漂亮的 Nuxt，但是当我在模板中使用“this”时，它突然抛出一个错误。 6:15  error  Unexpected usage of 'this'  vue/this-in-template 7:15  error  Unexpected usage of 'this'  vue/this-in-template 11:15  error  Unexpected usage of 'this'  vue/this-in-template 12:15  error  Unexpected usage of 'this'  vue/this-in-template我正在尝试重写我的 .eslintrc.js 文件，但我找不到允许我绕过这个 es-lint 错误的规则。我知道代码正在运行，因为我可以在后台看到结果传递叠加层。<template> <div class="slugWrapper">    <h1>this is {{ $route.params.slug }}</h1>     <div class="card">      <video        v-if="this.cards[0].type == 'Video'"        :src="this.cards[0].imageurl"        class="card__video"       @click="playPause" />     <img        v-if="this.cards[0].type=='Image'|| 'image/jpeg'"       :src="this.cards[0].imageurl"       class="card__image"       alt="Image">   </div> </div>我需要一个规则或方法来忽略这方面的 es lint

Answer 1

如果要禁用此规则，则需要忽略文件中的vue/this-in-template规则.eslintrc：

{

  "plugins": ["vue"],

  "rules": {

      "vue/this-in-template": "off"

  }

}

您可能需要将其eslint-plugin-vue安装为依赖项才能忽略此规则。

话虽如此，这条规则的存在可能是有原因的，所以你可能需要考虑重构你的代码，这样你就不需要this在你的 Vue 模板中使用。