在Vue 3.0中，与Vue 2.0相比，有一些改变和新的特性涉及到props。
- Composition API: Vue 3.0引入了Composition API，它提供了一种新的方式来组织和重用组件的逻辑。在Composition API中，props可以通过使用
setup函数中的props参数来定义。你可以像在Vue 2.0中一样通过对象来定义props，也可以通过使用defineProps函数来定义props。
// Vue 2.0 Vue.component('my-component', { props: ['message'], template: '<div>{{ message }}</div>' }) // Vue 3.0 import { defineComponent, defineProps } from 'vue' const MyComponent = defineComponent({ props: { message: String }, setup(props) { return { ... } } })
- 编译时校验: Vue 3.0增加了编译时校验的能力，这意味着在开发阶段，你可以在模板中直接得到props的类型检查。这对于提高代码的健壮性和可维护性非常有帮助。
- 默认值和类型: 在Vue 3.0中，你可以通过使用
default属性来为props设置默认值，类似于Vue 2.0。此外，你也可以使用type属性来指定props的类型，这样可以更好地约束props的值。
// Vue 2.0 props: { message: { type: String, default: 'Hello' } } // Vue 3.0 import { defineProps } from 'vue' const props = defineProps({ message: { type: String, default: 'Hello' } }) const MyComponent = defineComponent({ props, setup(props) { return { ... } } })
总的来说，Vue 3.0中的props的定义和使用方式与Vue 2.0相比没有太大的变化，但引入了Composition API和编译时校验的功能，使props的使用更加灵活和可靠。
