我做了一些调查，发现此功能已被请求：https://github.com/prettier/prettier/issues/4125
在2020年的漂亮2.0版本中，对漂亮进行了修改（https://github.com/prettier/prettier/pull/6685）并发布（https：//prettier.io/blog/2020/03/21/2.0.0.html#改进方法链断裂启发式-6685
但看看你提供的例子，它仍然没有工作很明显：/
如果有任何选项可以更好地配置此行为，它应该在这里：但是我没有找到任何对你的案子有帮助的东西。
在我看来你现在唯一能做的就是

<!-- prettier-ignore -->

..在你的行之前。你可以在这里阅读更多关于漂亮的忽略的html：https://prettier.io/docs/en/ignore.html#html

这里的主要问题是arrow函数体中的大括号，如果你在函数体中调用一个函数，你可以简单地做如下操作：

<button @click="(event) => doSomething(event)">Do something</button>

<!-- In Vue, you can also use this shorter syntax -->
<button @click="doSomething($event)">Do something</button>

为了省略大括号，需要从arrow函数返回一个expression（查看MDN文档了解更多信息）。This article很好地解释了表达式是如何定义的。
表达式是计算结果为某个值的代码片段
由于变量赋值是一个表达式，你可以省略大括号（Pretier会在arrow函数的函数体周围加上括号，以更清楚地表明它是一个单一的东西）。Pretier对此有不同的处理，如果你没有超过printWidth，应该把它呈现在同一行上。下面是一些默认的Pretier设置的例子，除了printWidth设置为120：

<!-- Without braces (Prettier will add the parentheses) -->
<button @click="() => (someVariable = 'New value')">Assign a value to a variable</button>
<button @click="() => (true ? doSomething() : doSomethingElse())">Ternary operator</button>

<!-- Braces -->
<button
  @click="
    () => {
      someVariable = 'New value';
    }
  "
>
  Assign a value to a variable
</button>
<button
  @click="
    () => {
      true ? doSomething() : doSomethingElse();
    }
  "
>
  Ternary operator
</button>

注解

这些例子只是为了说明Prettier是如何处理事情的。在Vue中，你实际上可以只执行@click="someVariable = 'New value'"，但是在某些其他框架中，你可能需要完整的箭头函数。根据需要调整你的框架，但是Prettier的行为应该是相似的。