
文章链接
js语言和框架-vue.js-vue2、vue3的区别
面5笔5简单介绍vue3新增特性组合式 API:setup()
setup() 钩子是在组件中使用组合式 API 的入口,通常只在以下情况下使用:
1.需要在非单文件组件中使用组合式 API 时。
2.需要在基于选项式 API 的组件中集成基于组合式 API 的代码时。
其他情况下,都应优先使用 < script setup> 语法。
(1)ref
创建值类型响应式数据方法
在seup内部需要 .value 来访问设置值
(2) reactive
创建引用类型响应式数据方法
(3)defineProps
定义 组传的传参props
(4)defineEmits
定义组件发送的事件
(5)watch
监听一个数据的变化
(6)watchEffect
监听多个数据
(7)生命周期
setup中的生命周期,没有beforeCreate与created
setup的生命周期需要加on前缀