Question

我正在尝试格式化我的文件，但引号被添加到新行并将我的文件转换为字符串。 prettier / vscode 中是否有设置不将引号格式化到新行。代码如下：

输出什么。

@click="
   createStudent()
   $emit('hide-modal')
   makeToast('success')
"

我想要什么

@click="createTag(); $emit('hide-modal'); makeToast('success')"

这是我的 Eslint 文件：

module.exports = {
  root: true,
  extends: [
    'plugin:vue/essential',
    'plugin:prettier/recommended',
    'eslint:recommended'
  ],
  parserOptions: {
    parser: 'babel-eslint',
    sourceType: 'module'
  },
  rules: {
    quotes: [2, 'single', { avoidEscape: true, allowTemplateLiterals: true }],
    'prettier/prettier': [
      'warn',
      {
        singleQuote: true,
        semi: false
      }
    ]
  }
}

Answer 1

您需要在每个函数调用的末尾包含分号

<button
  @click="
    call1();
    call2();
  "
>
  test me
</button>

Example

另一种处理这个问题的方法（我认为是更好的方法）是创建一个调用所有三个函数的方法。

<template>
    <button @click="blahBlahClickHandler"> press me </button>
</template>

<script>
export default {
    methods:{
        blahBlahClickHandler(){
            this.createStudent();
            this.$emit('hide-modal');
            this.makeToast('success');
        }
    }
}
</script>

Vs 代码引号被格式化为新行导致文件是一个字符串

1 个答案: