<script lang="ts" setup>作用

`<script lang="ts" setup>` 是Vue 3中引入的一种新的组件编写方式，它结合TypeScript（TS）语法，允许你在JavaScript的setup函数中定义组件的行为和状态。这个特性简化了组件内部的状态管理和生命周期钩子的使用。

1. **声明式状态管理**[^1]：
- `defineProps` 函数用于声明组件接收的props（属性），如`msg`和`title`，并可以指定默认值。这使得组件具有可配置性，但同时也保证了默认行为。

   withDefaults(defineProps<{ msg: string; title: string }>(), { msg: "哈哈哈", title: "学习中ing" })

这意味着组件会自动获得这些prop的默认值，除非它们在父组件中被明确地传递。

2. **选项API的集成**：
- `defineOptions` 函数用于定义组件的选项，如组件的名字，这是在组件实例化时可以访问的对象。

   defineOptions({ name: 'TButton' });

这样做的好处是你可以更清晰地组织和复用组件的逻辑，而不需要在每个组件里重复写相同的配置。

总的来说，`<script lang="ts" setup>` 结合了TypeScript的强大类型系统和Vue的简洁API，提供了一种更现代、更模块化的组件开发体验。