将参数传递给 Vue 中的方法时出现 ESLint 错误

Question

我的 Vue 页面出现 ES Lint 解析错误。发生这种情况是因为我传递给该方法的参数包含一个“。”符号。

Error - Syntax Error: Unexpected token (1:1628)

<div class="text-sm font-medium" v-bind:class="{ highlight(coin.price_change_percentage_24h) }">

这种语法的解决方法是什么？有没有办法在模板文件中转义？

可以找到完整代码here

在此先感谢您的帮助！

Answer 1

将 highlight 定义为计算属性其中 returns 以价格作为参数的函数 :


    computed:{
      highlight(){
        return (priceChange)=>{
        if(priceChange < 0)
        {
          return 'text-red-900'
        }
        if(priceChange > 0)
        {
          return 'text-green-900'
        }
        return '';
       }
      }
    },

并在不使用 {} 的情况下将其绑定到 class :

<div class="..." v-bind:class="highlight(coin.price_change_percentage_24h)">

将参数传递给 Vue 中的方法时出现 ESLint 错误

ES Lint Error When Passing Parameter to Method in Vue

javascript

vue.js

nuxt.js