(一)需要

面试时,被问到。Options API 和Composition API区别,没答上来。这里小结记录下。

(二)介绍

这俩能够归属到Vue2和Vue3的在写法层面的区别。

1、Options API

  • 选项API
  • 是Vue2用法

2、Composition API

  • 组合API
  • 是Vue3用法

Demo 如下

<template>  <div id="app">    <input type="text" v-model="val" @keyup.enter="addTodo">    <ul>      <li v-for="todo in todos" :key="todo.id">{{todo.title}}</li>    </ul>  </div></template><script>import {reactive, ref, toRefs} from 'vue'export default {  setup(){    let val = ref('')    let todos = reactive([         {id:0, title:'吃饭', done:false},        {id:1, title:'睡觉', done:false},        {id:2, title:'lsp', done:false},    ])    function addTodo(){      todos.push({        id:todos.length,        title:val.value,        done:false      })      val.value = ''    }    return {val, todos, addTodo}  }}</script>

参考链接

https://mp.weixin.qq.com/s/UZ...

写在最初的话

学习路上,经常会懈怠。

《有想学技术须要监督的同学嘛~》
https://mp.weixin.qq.com/s/Fy...

如果有须要的搭档,能够加我微信:learningisconnecting
或者能够关注我的公众号:国星聊成长(我会分享成长的办法)