意外使用“此” es-lint错误,要禁用哪些规则?

时间:2019-05-26 19:16:17

标签: javascript vue.js eslint nuxt.js

我正在使用配置了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

1 个答案:

答案 0 :(得分:1)

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

{
  "plugins": ["vue"],
  "rules": {
      "vue/this-in-template": "off"
  }
}

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

话虽这么说,该规则可能是有原因的,所以您可能要考虑重构代码,从而无需在Vue模板中使用this