Vue3.2 setup语法糖

setup简单介绍

起初Vue3.0版本变量和方法都是要 return 出来才可以使用,很不友好。在Vue3.2版本推出了 `setup` 语法糖之后,属性和方法都不需要 return 出去了,组件也不需要注册就可以直接使用了,下面慢慢来介绍。

setup基本语法



// 在script 标签加 setup


// 如果是用ts来写 则在script 标签加lang='ts'即可

属性和方式不用return





组件不需要组册



defineProps的使用

defineProps是子组件用来接收父组件传递的参数

// 父组件


// 子组件


defineEmits的使用

defineEmits主要是子组件给父组件传递参数的

// 父组件   


// 子组件

defineExpose的使用

使用

// 子组件

 

如何给组件命名



// 再加一个script给组件命名即可

async和await的使用

不必再配合 async 就可以直接使用 await 了。代码会被编译成async setup()

你可能感兴趣的:(javascript,前端,vue.js)