https://blog.papergate.top/tags/vue3/我的个人博客Hugo 0.162.1 & FixIt v0.4.5zh-CNFri, 24 Jul 2026 16:33:06 +0800https://blog.papergate.top/posts/%E7%BB%BC%E5%90%88%E5%AE%9E%E6%88%98%E4%BA%A7%E5%93%81%E5%B1%95%E7%A4%BA%E7%AB%99/Fri, 24 Jul 2026 10:00:00 +0800https://blog.papergate.top/posts/%E7%BB%BC%E5%90%88%E5%AE%9E%E6%88%98%E4%BA%A7%E5%93%81%E5%B1%95%E7%A4%BA%E7%AB%99/网页开发从创建项目开始，综合运用 Vue 3 组合式 API、Tailwind CSS、Vue Router 和 Pinia，完整搭建一个产品展示站。https://blog.papergate.top/posts/%E5%8C%96%E7%B9%81%E4%B8%BA%E7%AE%80%E7%BB%84%E5%90%88%E5%BC%8F%E5%87%BD%E6%95%B0%E5%B0%81%E8%A3%85%E9%80%BB%E8%BE%91/Wed, 22 Jul 2026 15:00:00 +0800https://blog.papergate.top/posts/%E5%8C%96%E7%B9%81%E4%B8%BA%E7%AE%80%E7%BB%84%E5%90%88%E5%BC%8F%E5%87%BD%E6%95%B0%E5%B0%81%E8%A3%85%E9%80%BB%E8%BE%91/网页开发组合式函数（Composable）是 Vue 3 中复用逻辑的主要方式。本文介绍如何使用 composable 封装可复用的逻辑，以及它与 Pinia 的区别。https://blog.papergate.top/posts/%E7%A7%A9%E5%BA%8F%E4%B9%8B%E7%BE%8Epinia-%E7%8A%B6%E6%80%81%E7%AE%A1%E7%90%86/Wed, 22 Jul 2026 14:30:00 +0800https://blog.papergate.top/posts/%E7%A7%A9%E5%BA%8F%E4%B9%8B%E7%BE%8Epinia-%E7%8A%B6%E6%80%81%E7%AE%A1%E7%90%86/网页开发Pinia 是 Vue 3 的官方状态管理库。本文介绍 store 的定义、state/getters/actions 的使用，以及在组件中读取和修改状态的方法。https://blog.papergate.top/posts/%E8%B7%AF%E5%BE%84%E7%9A%84%E8%89%BA%E6%9C%AFvue-router-%E5%AE%8C%E5%85%A8%E6%8C%87%E5%8D%97/Wed, 22 Jul 2026 14:00:00 +0800https://blog.papergate.top/posts/%E8%B7%AF%E5%BE%84%E7%9A%84%E8%89%BA%E6%9C%AFvue-router-%E5%AE%8C%E5%85%A8%E6%8C%87%E5%8D%97/网页开发Vue Router 是 Vue 3 的官方路由库。本文介绍路由的基本配置、命名路由、嵌套路由、动态路由、编程式导航和导航守卫。https://blog.papergate.top/posts/%E7%BB%84%E4%BB%B6%E8%BF%9B%E9%98%B6%E4%BE%9D%E8%B5%96%E6%B3%A8%E5%85%A5%E4%B8%8E%E6%A8%A1%E6%9D%BF%E5%BC%95%E7%94%A8/Wed, 22 Jul 2026 13:00:00 +0800https://blog.papergate.top/posts/%E7%BB%84%E4%BB%B6%E8%BF%9B%E9%98%B6%E4%BE%9D%E8%B5%96%E6%B3%A8%E5%85%A5%E4%B8%8E%E6%A8%A1%E6%9D%BF%E5%BC%95%E7%94%A8/网页开发本文介绍 Vue 3 组件通信的进阶方案，包括跨层级传数据的 provide/inject、获取 DOM 的模板 ref、暴露子组件方法的 defineExpose，以及组件上的 v-model 双向绑定。https://blog.papergate.top/posts/%E7%95%99%E7%99%BD%E7%9A%84%E4%BC%98%E9%9B%85%E6%8F%92%E6%A7%BD%E5%86%85%E5%AE%B9%E5%88%86%E5%8F%91/Wed, 22 Jul 2026 12:30:00 +0800https://blog.papergate.top/posts/%E7%95%99%E7%99%BD%E7%9A%84%E4%BC%98%E9%9B%85%E6%8F%92%E6%A7%BD%E5%86%85%E5%AE%B9%E5%88%86%E5%8F%91/网页开发插槽（Slot）是 Vue 3 中一种特殊的内容分发机制。它让父组件可以向子组件内部传递模板片段，实现更灵活的组合。https://blog.papergate.top/posts/%E7%BB%84%E4%BB%B6%E9%80%9A%E4%BF%A1props-%E4%B8%8E%E4%BA%8B%E4%BB%B6%E9%80%9A%E4%BF%A1/Wed, 22 Jul 2026 12:00:00 +0800https://blog.papergate.top/posts/%E7%BB%84%E4%BB%B6%E9%80%9A%E4%BF%A1props-%E4%B8%8E%E4%BA%8B%E4%BB%B6%E9%80%9A%E4%BF%A1/网页开发组件之间需要传递数据。props 实现父传子，事件实现子传父。本文介绍这两种最基础的组件通信方式。https://blog.papergate.top/posts/%E7%BB%84%E4%BB%B6%E7%9A%84%E8%89%BA%E6%9C%AF%E6%9E%84%E5%BB%BA%E5%8F%AF%E5%A4%8D%E7%94%A8%E7%89%87%E6%AE%B5/Wed, 22 Jul 2026 11:30:00 +0800https://blog.papergate.top/posts/%E7%BB%84%E4%BB%B6%E7%9A%84%E8%89%BA%E6%9C%AF%E6%9E%84%E5%BB%BA%E5%8F%AF%E5%A4%8D%E7%94%A8%E7%89%87%E6%AE%B5/网页开发组件是 Vue 3 中最基本的代码组织单元。本文介绍组件的创建、使用、命名规约以及生命周期钩子在实践中的应用。https://blog.papergate.top/posts/%E6%A8%A1%E6%9D%BF%E8%AF%AD%E6%B3%95%E6%8C%87%E4%BB%A4%E4%B8%8E%E6%95%B0%E6%8D%AE%E7%BB%91%E5%AE%9A/Wed, 22 Jul 2026 11:00:00 +0800https://blog.papergate.top/posts/%E6%A8%A1%E6%9D%BF%E8%AF%AD%E6%B3%95%E6%8C%87%E4%BB%A4%E4%B8%8E%E6%95%B0%E6%8D%AE%E7%BB%91%E5%AE%9A/网页开发Vue 3 的模板语法包括文本插值、属性绑定、条件渲染、列表渲染、事件处理和表单绑定。本文按数据流向逐一介绍。https://blog.papergate.top/posts/%E5%93%8D%E5%BA%94%E5%BC%8F%E7%B3%BB%E7%BB%9Fref-%E4%B8%8E-reactive-%E4%B9%8B%E9%81%93/Wed, 22 Jul 2026 10:30:00 +0800https://blog.papergate.top/posts/%E5%93%8D%E5%BA%94%E5%BC%8F%E7%B3%BB%E7%BB%9Fref-%E4%B8%8E-reactive-%E4%B9%8B%E9%81%93/网页开发响应式系统是 Vue 3 的核心，它让数据变化自动更新页面。本文介绍 setup、ref、reactive、computed、watch 以及生命周期钩子。https://blog.papergate.top/posts/%E5%88%9D%E8%AF%86-vue-3%E5%BC%80%E5%90%AF%E5%89%8D%E7%AB%AF%E6%96%B0%E4%B8%96%E7%95%8C/Wed, 22 Jul 2026 10:00:00 +0800https://blog.papergate.top/posts/%E5%88%9D%E8%AF%86-vue-3%E5%BC%80%E5%90%AF%E5%89%8D%E7%AB%AF%E6%96%B0%E4%B8%96%E7%95%8C/网页开发Vue 3 是一个渐进式前端框架。本文介绍如何创建 Vue 项目、项目文件结构以及单文件组件的组成。