eslint error list

最新推荐文章于 2024-11-06 09:50:35 发布

Hello_Tree__

最新推荐文章于 2024-11-06 09:50:35 发布

阅读量940

点赞数

文章标签： js vue html javascript vue.js

本文链接：https://blog.youkuaiyun.com/Hello_Tree__/article/details/112538799

版权

本文主要列举并解析了在Vue项目中遇到的一些ESLint错误，包括未使用的button组件、非驼峰命名、props语法错误、代码行长度限制、v-model在不正确元素上的使用、未引用的对象构造以及避免使用for...in循环等问题。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

注册了button组件但是没有使用
88:5 error The "button" component has been registered but not used vue/no-unused-components。

没有使用驼峰命名法
154:32 error Identifier 'unread_total' is not in camel case camelcase.

let unread_total = 0// bad
let unreadTotal = 0//good

vue的props语法报错，默认值应该是一个函数/默认值是字符串
32:7 error Type of the default value for 'msgData' prop must be a function vue/require-valid-default-prop.
20:7 error Type of the default value for 'Value' prop must be a string vue/require-valid-default-prop

props:{
	msgData:[]//bad
	msgData:()=>[]//good
}

每行长度不能超过120
2:1 error This line has a length of 177. Maximum allowed is 120 max-len

//bad
 <text-btn @click.native="addVaspActive = addVaspActive?false:true" background="white" border="1px solid #1B7DFE" width="150px"color="#1B7DFE"><i :class="addVaspActive?'vasp-icon-close':'vasp-icon-add'" class="el-icon-plus link-color"></i>文字文字</text-btn>
 //good
 <text-btn @click.native="addVaspActive = addVaspActive?false:true"
     background="white" border="1px solid #1B7DFE" width="150px" color="#1B7DFE">
     <i :class="addVaspActive?'vasp-icon-close':'vasp-icon-add'" class="el-icon-plus link-color"></i>文字文字
 </text-btn>

v-model出现在了span标签上
5:13 error 'v-model' directives aren't supported on <span> elements vue/valid-v-model

<span v-model=""></span>//bad
<input v-model=""></input>//good

使用new 构造了一个对象，但是没有引用
121:9 error Do not use 'new' for side effects no-new

import Vue form 'vue';
//bad
new Vue({
  el: '#app',
  store,
  router,
  components: { App },
  template: '<App/>',})
//good
const vm = new Vue({
  el: '#app',
  store,
  router,
  components: { App },
  template: '<App/>',
});
Vue.use({ vm });

不要使用for…in，因为它会遍历出你不需要的属性，比如length。
318:11 warning for..in loops iterate over the entire prototype chain, which is virtually never what you want. Use Object.{keys,values,entries}, and iterate over the resulting array no-restricted-syntax

const arr = [1,2,3];
for(const item in arr ){
//bad
}
for(const i=0;i<arr.length;i++){
//good
}

应该在函数括号结尾处有个return
86:53 warning Expected to return a value at the end of arrow function array-callback-return

let list = [{id:0},{id:1},{id:2},{id:4},{id:3},{id:5}];
//bad
list.map((item)=>{
	let obj = {};
	if(item.id>0){
		obj.id = item.id
		return obj;
	}
})
//good
list.map((item)=>{
	let obj = {};
	if(item.id>0){
		obj.id = item.id
	}
	return obj;
})