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");