eslint基本语法错误改正

2021-12-14  本文已影响0人  有一个程序媛

今天心血来潮,引入了eslint,发现以前的很多写法全部飘红,个人觉得还是校验比较严格的,不一定非要加上,看个人需求
以下,我罗列了一些比较典型的语法错误,也许我们觉得没有写法问题,但是eslint会校验出他的问题。
1.Getting a value from the props in root scope of setup() will cause the value to lose reactivity
错误写法

name: 'CForm',
  setup(props) {
    const { option } = props
    const form = reactive({
      ...option.formModel
    })

正确写法

name: 'CForm',
  setup(props) {
    const { option } = {
      ...props
    }
    const form = reactive({
      ...option.formModel
    })

2.Array.prototype.map() expects a return value from arrow function array-callback-return
用forEach替代就行了,map必须返回return
3.空格的正常修复
4.解构赋值
错误写法

const data = props.data

正确写法

const { data } = props

5.Expected a default case
Switch尾部加default

case 'delete': // 删除
   Modal.confirm({
        title: <div>
              <span class="color-warning mr1">
                <ExclamationCircleOutlined />
              </span>
              删除确认信息
            </div>,
        content: '是否确认删除该零件?',
        onOk() {
        }
     })
    break
 default:
    break

6.Expected 1 empty line after import statement not followed by another import import/newline-after-import
最后一个import加空行,如下

import { onMounted, defineComponent, reactive } from 'vue'
import { message } from 'ant-design-vue'

const Index = defineComponent({

7.Unexpected string concatenation prefer-template
必须要用字符串模板替代字符串拼接
错误写法

<span class="pointer">
     <Avatar src={headImg} />
     <span class="ml1">{data.subStr(userInfo.value.realName + '')}</span>
</span>

正确写法

 <span class="pointer">
     <Avatar src={headImg} />
     <span class="ml1">{data.subStr(`${userInfo.value.realName}`)}</span>
 </span>

8.不能用for循环
错误写法

    for (const key in obj) {
      data[key] = obj[key]
    }

正确写法

    Object.keys(obj).forEach((item) => {
      data[item] = obj[item]
    })
上一篇下一篇

猜你喜欢

热点阅读