在Vue 3开发中，props和emits是组件通信的重要方式，合理使用它们并指定类型与默认值，能提升代码的可读性和稳定性。

首先来看看props。props用于父组件向子组件传递数据。在定义props时，可以通过多种方式指定类型。例如，基本类型定义如下：

<script setup>
const props = defineProps({
  // 字符串类型
  title: String,
  // 数字类型
  count: Number,
  // 布尔类型
  isVisible: Boolean
});
</script>

上述代码中，title被定义为字符串类型，count为数字类型，isVisible为布尔类型。如果父组件传递的数据类型不符合定义，Vue会在开发环境下给出警告。

除了基本类型，还可以使用对象来详细定义props。比如：

<script setup>
const props = defineProps({
  name: {
    type: String,
    required: true,
    default: 'default name'
  },
  age: {
    type: Number,
    default: 18
  }
});
</script>

这里name属性被设置为必传，同时提供了默认值。当父组件没有传递name时，就会使用默认值“default name”。而age属性定义为数字类型并设置了默认值18。

接着讲讲emits。emits用于子组件向父组件发送事件。同样可以对其进行类型定义。例如：

<script setup>
const emits = defineEmits(['itemSelected']);

const handleClick = () => {
  emits('itemSelected', 'selected value');
};
</script>

在这个例子中，子组件定义了一个名为itemSelected的自定义事件，当handleClick函数被调用时，就会触发该事件并传递一个值“selected value”。

为了让代码更加规范，还可以使用类型别名或接口来定义props和emits的类型。例如：

// 定义props类型接口
interface Props {
  message: string;
  num: number;
}

// 定义emits类型
type Emits = {
  (e: 'customEvent', value: string): void;
};

<script setup lang="ts">
const props = defineProps<Props>();
const emits = defineEmits<Emits>();
</script>

通过这种方式，代码的类型更加清晰明确。

在Vue 3中合理使用props和emits，并准确指定类型与默认值，不仅能增强代码的可维护性，还能提高开发效率，让项目的结构更加清晰。无论是小型项目还是大型企业级应用，这些技巧都是非常实用的。