1. 乙個元件中宣告乙個變數，之前是在data裡面，現在可以寫在setup裡面
export default );
let timer;
onmounted(() => , 1000);
});onunmounted(() => );
const data = usercounter(); // 這樣的話可以統一建立乙個js檔案用的時候直接引入進去，setup也看著比較簡潔，一目了然，**也能很好的得到復用。
// 在模板中使用data資料的話必須帶上data.counter, data.doublecounter，那這個時候就可以使用torefs，已實現對物件的解構，這樣上下文中就可以直接用counter，doublecounter。
const = usercounter();
// 其他資料，單值響應式
const msg = ref("some message");
// 使用元素的引用
const desc = ref(null);
// 偵聽器
watch(counter, (val, oldval) => to $`;
});return ;
},beforecreate() ,
created() ,
};function usercounter() );
let timer;
onmounted(() => , 1000);
});onunmounted(() => );
return torefs(data);
}
以前使用渲染函式，它的特性和屬性是分開的，包括事件/原生事件也是分開的,在寫的時候可能會寫錯地方
vue3的修改對於渲染函式來說變得更加簡單好用了，修改主要有以下幾點：
render() },
`i am comp, $`
),h('button', },
`click it !!!`
),])
}
在vue3中函式式元件變化較大，有以下幾點：
// 宣告乙個函式式元件，functional.vue
import from 'vue';
const heading = (props, context) `, context.attrs, context.slots);
}heading.props = ['level']
export default heading;
// 元件使用：
這是乙個h3標籤內容
// 渲染結果：
bind ——> beforemount
inserted ——> mounted
beforeupdate ——> new! 元素自身更新前呼叫，和元件生命週期很像
update ——> removed!被移除，使用updated代替
componentupdated ——> updated
beforeunmount ——> new!元素將要移除時使用
unbind ——> unmounted
以上純屬個人理解，有問題歡迎指導~~
Vue可復用的過渡
過渡可以通過 vue 的元件系統實現復用。要建立乙個可復用過渡元件，你需要做的就是將或者作為根元件，然後將任何子元件放置在其中就可以了。使用template的簡單例子 vue.component my special transition afterenter function el 函式式元件更適...
vue3組合API（setup函式,系列二）
1，用vue2.x，實現乙個todos 從 中可以看到，vue2,資料和業務分離了，有新增功能，有刪除功能 直接點 li 標籤就刪除它 都是標準的方案，沒啥可說的。重點不是這個 todo list 應用，重點是，vue3 期望用 組合api 的方式來解決乙個應用中，資料和功能分離的問題。即方法和 d...
快速了解vue（3）
上次我們說到了.vue檔案，那麼這是個什麼檔案呢？啥也不是，就是個vue元件。我們都說要元件化，模組化什麼的，這.vue檔案就是個元件，開啟看看就知道了，它這裡有兩個，主要的標籤，乙個是，乙個是。這些我們肯定看得懂，標籤裡是寫html的，頁面就是由這許許多多的元件拼出來的，就像拼圖似的，想要修改頁面...