Vue百日学习计划Day43-45天详细计划-Gemini版

Day 43: Composable 函数基础与抽取简单逻辑 (~3 小时)

  • 本日目标: 理解 Composable 函数的概念、优势,并学会如何将简单的、无状态的逻辑抽取为 Composable。
  • 所需资源: Vue 3 官方文档 (组合式函数): https://cn.vuejs.org/guide/reusability/composables.html

学习计划:

  • 番茄时钟 1 (25 分钟工作 + 5 分钟休息):

    • 内容: Composable 函数的引入与优势。
    • 活动: 阅读官方文档中关于“组合式函数”的介绍。理解 Composable 函数是为了解决在 Composition API 中复用带状态逻辑的问题。对比它与 Mixin、Renderless Components 等传统复用方式的优缺点。
    • 思考: Composable 如何提升代码组织性、可读性以及类型推断能力?
    • 休息: 短暂休息。
  • 番茄时钟 2 (25 分钟工作 + 5 分钟休息):

    • 内容: Composable 函数的基本结构。
    • 活动: 学习 Composable 函数的约定:通常以 use 开头命名(如 useMouse),是普通的 JavaScript 函数,接受参数并返回状态和方法。
    • 实践: 在你的 Vue 项目中创建一个 src/composables 目录。在其中创建一个 useCounter.js 文件,定义一个简单的函数,不包含任何响应式状态,例如 export function useGreeting(name) { return Hello, ${name}; }
    • 休息: 快速调整状态。
  • 番茄时钟 3 (25 分钟工作 + 5 分钟休息):

    • 内容: 在组件中使用 Composable 函数。
    • 活动: 学习如何在组件的

你可能感兴趣的:(vue.js,学习,前端)