DEV Community
·
Vue - setup()中的Props和Context
💡
原文约400字/词，阅读约需2分钟。
📝
内容提要
在Composition API中，setup()函数接收两个参数：props和context。props是只读的反应式数据，context包含attrs、slots和emit，可以通过context.emit()发出自定义事件。
🎯
关键要点
- setup()函数接收两个参数：props和context。
- props是只读的反应式数据，不能直接修改。
- context包含attrs、slots和emit，提供额外的功能。
- attrs用于访问未声明为props的属性，如class或id。
- slots用于访问传递给组件的插槽内容。
- emit函数用于发出自定义事件。
- 可以通过context.emit()发出事件，示例中展示了如何使用emit。
- 可以在setup中解构第二个参数以便更方便地使用attrs和slots。
❓
延伸问答
setup()函数的参数是什么？
setup()函数接收两个参数：props和context。
props在setup()中有什么特点？
props是只读的反应式数据，不能直接修改。
context对象包含哪些内容？
context对象包含attrs、slots和emit，提供额外的功能。
如何使用context.emit()发出自定义事件？
可以通过context.emit()发出自定义事件，例如在setup中调用emit函数。
attrs和slots在setup()中如何使用？
可以通过context访问attrs和slots，attrs用于访问未声明为props的属性，slots用于访问传递的插槽内容。
在setup()中如何解构context参数？
可以通过解构第二个参数来方便地使用attrs和slots，例如setup(props, { emit, attrs, slots })。
➡️
