## composition api解决了 vue2 的哪些弊端 * 可读性差，复用性差，ts支持差 * 逻辑不能很好的复用 ## setup * 调用时机 - 组件创建之前（created ）执行 * this 指向 - this指向window * 函数参数 - props、context * 返回值 - object ``` import { onMounted, reactive, ref, watch, toRefs, nextTick, getCurrentInstance } from '@vue/composition-api' export default { components: { }, setup (props, { root }) { const videoUrl = ref('') const playbackInfo = reactive({ name: '', teacherName: '', teacherImg: '' }) const keydownListener = () => { // ... } onMounted(() => { keydownListener() }) watch(videoUrl, newValue => { // ... }) return { videoUrl, ...toRefs(playbackInfo), } } } ```