最近在使用Vue的时候把三元运算符写进template部分的时候遇到了错误
代码:
<div> {{ (index < 1) ? 1 : index }} </div>
其实上面这个代码是可以正常运行的,但是Eslint会报错,因为在Html代码中会校验到一个单独的<
号,会被Eslint认为是Html代码的一部分而不会认为是模板语言,但因为Vue会去解析这部分的表达式再进行输出所以我们是可以正常运行的
那么不想让Eslint报错的话,
方法一:我们可以使用Html的转义符来进行对<
或>
号替换
<div> {{ (index < 1) ? 1 : index }} </div>
方法二: v-text方法
<div v-text="(index < 1) ? 1 : index"> </div>
解决Parsing error: invalid-first-character-of-tag-name.eslint-plugin-vue的报错