如何在 `<script setup>` 中定义 `name` 和 `inheritAttrs`？

【问题标题】：How to define `name` and `inheritAttrs` in `<script setup>`?如何在 `<script setup>` 中定义 `name` 和 `inheritAttrs`？
【发布时间】：2021-07-30 09:23:29
【问题描述】：

选项 API：

<script>
  import { defineComponent } from 'vue'

  export default defineComponent({
    name: 'CustomName', // ????
    inheritAttrs: false, // ????
    setup() {
      return {}
    },
  })
</script>

如何在 <script setup> 中做到这一点，是否有 name 和 inheritAttrs 的等价物，例如 defineProps 和 defineEmits？

<script setup>
  // ???? how to define them here?
</script>

【问题讨论】：

标签： javascript vue.js vuejs3 vue-composition-api vue-script-setup

【解决方案1】：

<script setup> 语法提供了表达大多数现有选项 API 选项的等效功能的能力，除了少数几个选项：

name
inheritAttrs
插件或库所需的自定义选项

如果您需要声明这些选项，请使用带有export default 的单独普通<script> 块：

<script>
  export default {
    name: 'CustomName',
    inheritAttrs: false,
    customOptions: {},
  }
</script>

<script setup>
  // script setup logic
</script>

编译输出：

<script>
  export default {
    name: 'CustomName',
    inheritAttrs: false,
    customOptions: {},
    setup() {
      // script setup logic
    },
  }
</script>

【讨论】：