- Introduced Vue3 exercises covering composable API, reactivity, lifecycle hooks, and built-in components. - Added structured interview plan for frontend candidates focusing on HTML, CSS, JavaScript, TypeScript, and Vue. - Included starter files for each exercise and detailed README documentation for guidance.
31 lines
675 B
JavaScript
31 lines
675 B
JavaScript
const { createApp, ref, computed, watch, watchEffect } = Vue;
|
|
|
|
createApp({
|
|
setup() {
|
|
const keyword = ref("");
|
|
const courses = ref([
|
|
{ id: 1, title: "ref 和 reactive" },
|
|
{ id: 2, title: "watch 和 watchEffect" },
|
|
{ id: 3, title: "组件通信" },
|
|
]);
|
|
|
|
const filteredCourses = computed(() => {
|
|
// 任务:根据 keyword 过滤课程
|
|
return courses.value;
|
|
});
|
|
|
|
watch(keyword, (newValue, oldValue) => {
|
|
// 任务:输出关键字变化日志
|
|
});
|
|
|
|
watchEffect(() => {
|
|
// 任务:输出当前筛选后的数量
|
|
});
|
|
|
|
return {
|
|
keyword,
|
|
filteredCourses,
|
|
};
|
|
},
|
|
}).mount("#app");
|