首页 » 软件开发 » setup函数的使用方法,掌握6个方面知识要点(函数使用方法翻译要点文档)

setup函数的使用方法,掌握6个方面知识要点(函数使用方法翻译要点文档)

少女玫瑰心 2024-07-23 23:19:25 0

扫一扫用手机浏览

文章目录 [+]

setup

setup函数是作为一个新的组件选项。
它作为在组件内部使用Composition API的入口。

一、调用时机

创建组件实例时,并且props初始化解析完成后,setup函数立即调用。
其能够智能性地选择在beforeCreate钩子之后而在created钩子之前调用。

setup函数的使用方法,掌握6个方面知识要点(函数使用方法翻译要点文档) 软件开发
(图片来自网络侵删)

二、模板用法

如果setup返回的是一个对象,该对象上的属性将合并到组件模板的渲染上下文中:

请注意,setup返回的refs对象会自动展开在模板中,因此不需要写属性.value。

三、渲染函数/ JSX的用法

setup 也可以返回一个渲染函数,可以直接在同域内声明要使用的响应式状态:

需要注意的是,.value不能省略,模板template中就可以。

四、参数

setup函数接收解析后props作为其第一个参数:

请注意,props对象是响应式的 -,传入新的prop时也会跟着更新,并且watch函数可以监听到props变化。

该props对象在开发期间对于用户而言是不可变的(如果试图改变它,将发出警告)。

第二个参数提供了一个上下文对象,该对象暴露的一系列可选的属性,与之前在2.x API中this包含的属性一致:

attrs和slots是内部组件实例上相应值的代理。
这样可以确保它们在更新后始终显示最新值,不必担心在对它们进行解构时,引用是过时的:

五、 this用法

setup()里面没有this。

魔法this可能带来许多诡异的事情,直接抛弃。

六、类型检查

更好支持typescript

给setup()进行传参时,为了获取类型推断,需要使用createComponent。

欢迎关注

标签:

相关文章

语言中的借用,文化交融的桥梁

自古以来,人类社会的交流与发展离不开语言的传播。在漫长的历史长河中,各民族、各地区之间的文化相互碰撞、交融,产生了许多独特的语言现...

软件开发 2025-01-01 阅读1 评论0

机顶盒协议,守护数字生活的新卫士

随着科技的飞速发展,数字家庭逐渐走进千家万户。在这个时代,机顶盒成为了连接我们与丰富多彩的数字世界的重要桥梁。而机顶盒协议,作为保...

软件开发 2025-01-01 阅读1 评论0

语言基础在现代社会的重要性及方法步骤

语言是人类沟通的桥梁,是社会发展的基础。语言基础作为语言学习的基石,对于个人、社会乃至国家的发展具有重要意义。本文将从语言基础在现...

软件开发 2025-01-01 阅读2 评论0

粤语电影,传承文化,点亮时代之光

粤语电影,作为中国电影产业的一朵奇葩,以其独特的地域特色、丰富的文化内涵和鲜明的艺术风格,赢得了广大观众的喜爱。本文将从粤语电影的...

软件开发 2025-01-01 阅读3 评论0

苹果游戏语言,塑造未来娱乐体验的基石

随着科技的飞速发展,游戏产业逐渐成为全球娱乐市场的重要支柱。在我国,游戏产业更是蓬勃发展,吸引了无数玩家和投资者的目光。而在这其中...

软件开发 2025-01-01 阅读1 评论0