第一次Composition API
在vue3.2中,正式支持了script setup的写法,这样可以大大简化组件的代码量,减少一些重复操作,我认为当你写vue3时,应该把这当作默认写法。在vue3.2之前,一般会这样写。
<script>
export default {
setup(props,ctx){
const a = ref(0)
//必须return才能在template中使用,这里就存在一个重复操作的问题,每次都得cv,万一忘记就得检查
return {
a
}
}
}
</script>
那么现在,我们可以这样写,对比一下,减少了多少行代码呢
<script setup>
const a = ref(0)
</script>
PS:之后的代码我会省略script setup,默认都在script setup标签下。
也许你会觉得这样就更简单了,其实恰恰相反,CompositionAPI其实要求你对逻辑处理有更清晰的认识,对于封装有更高的要求,否则,你一样会写成比以前更丑的代码。例如:
const a = ref(0)
const b &#