Options Api
Options API
,即选项API,即以vue
为后缀的文件,通过定义methods
,computed
,watch
,data
等属性与方法,共同处理页面逻辑
如下图:
Composition Api
在 Vue3 Composition API 中,组件根据逻辑功能来组织的,一个功能所定义的所有 API 会放在一起(更加的高内聚,低耦合)
<template>
<span>
<span id="num">{{num}}</span>
<input type="button" value="+1" @click="f1">
</span>
</template>
<script setup>
import {ref} from "vue"
var num = ref(10)
function f1() {
num.value++
console.log(num.value)
}
</script>
参考文章: https://www.jianshu.com/p/5ebec903712c