当我不想要它时，更漂亮地格式化 Vue 组件

Question

我已将 Prettier 配置为在保存时格式化。

我正在使用从 npm 获得的 Vue 组件来显示来自 API 的数据。

<ExampleComponent 
    :aDynamicProp="foo"
    dataset="bar"
/>

组件需要道具dataset。

问题是 Prettier 想要在我每次保存时将 dataset 更改为 data-set。我想是因为它认为我正在尝试创建一个 HTML 数据属性。

根据 Prettier 文档，我尝试在组件上方添加  但这似乎不起作用（可能是因为我在保存时触发格式化，或者因为它是 Vue 模板而不是 HTML?).

任何人都可以阐明我如何强制 Prettier 忽略该道具吗？

非常感谢！

Answer 1

将冒号 : 添加到 :dataset 并且这应该可以解决问题，如果它只是在 dataset 内部执行的静态字符串，则使用反引号 [=15] 执行 :dataset="`my string`" =].如果您从 data(){}、computed 或 methods 获取数据，如下所述，那么只需执行 :dataset="yourData":

export default {
  data() {
    return {
      yourData: 'Your String'
    }
  },
  // or
  computed: {
    yourData() {
      return 'Your String'
    },
  },
  // or
  methods: {
    yourData() {
      return 'Your String'
    },
  },
};

当我不想要它时，更漂亮地格式化 Vue 组件

Prettier formatting a Vue component when I don't want it to

prettier