Vue3的setup

setup選項是一個接收props和context的函數是一個新的組件選項，作為Composition-API的入口點，只會被執行一次，用于建立數據與邏輯的連接。

注意點
在執行setup函數時，還沒執行created生命周期方法，因此在setup函數中，無法使用data和methods的變量和方法。
不能在setup函數中使用data和methods，在setup中使用this是無法操作的，因為setup 在生命周期beforeCreate和created之間執行，調用發生在 data property、computed property 或 methods 被解析之前，此時組件實例未實例化成功，所以data,methods等東西無法在 setup 中使用this被獲取。

{setup(props,context){context.attrs;context.slots;context.emit;context.listeners;context.root;context.parent;context.refs;return {};}
}

setup方法的返回值會合并到模板的上下文中參與數據的渲染。

setup函數的參數

setup(props,context)函數有兩個參數，props:組件接收的參數；context：是一個對象，包含attrs、slots、emit、expose這些屬性。

attrs：Attribute，非響應式對象，等同于$attrs

slots：插槽，非響應式對象，等同于$slots

emit：觸發事件，方法，等同于$emit，主要用來向父組件通信傳參

expose：暴露公共property，函數

   setup(props,context) {         //完整寫法console.log(props.title)   //獲取傳遞過來的title屬性... } setup(props) {...}            //只用propssetup(props, { attrs, slots, emit, expose }) {...} //context參數解構props不能用es6解構,會消除 prop 的響應性，解構需要借助 toRefs 或 toRef。