复制URL下哉ZY:https://www.666xit.com/3506/
download:深刻Go底层原理,重写Redis中间件实战
第一次Composition API
script setup
<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 = ref('')
const c = ref(true)
const d = reactive({})
const actionA = ()=>{a.value++}
const actionC = ()=>{c.value=!c.value}
const actionB = ()=>{b.value += 'test' }
const actiond = async ( )=> {
const res = await ajax(`url`)
d.a = res.a
d.b = res.b
d.c = res.c
}
const resetD = ()=>{
Object.keys(d).forEach(key=>delete d[key])
}
CompositionAPI