【Vue第3章】使用Vue脚手架_Vue2

目录

[3.1 初始化脚手架](#3.1 初始化脚手架)

[3.1.1 说明](#3.1.1 说明)

[3.1.2 具体步骤](#3.1.2 具体步骤)

[3.1.3 模板项目的结构](#3.1.3 模板项目的结构)

[3.1.4 笔记与代码](#3.1.4 笔记与代码)

[3.1.4.1 笔记](#3.1.4.1 笔记)

[3.1.4.2 01_src_分析脚手架](#3.1.4.2 01_src_分析脚手架)

[3.2 ref与props](#3.2 ref与props)

[3.2.1 ref](#3.2.1 ref)

[3.2.2 props](#3.2.2 props)

[3.2.3 笔记与代码](#3.2.3 笔记与代码)

[3.2.3.1 笔记](#3.2.3.1 笔记)

[3.2.3.2 02_src_ref属性](#3.2.3.2 02_src_ref属性)

[3.2.3.3 03_src_props配置](#3.2.3.3 03_src_props配置)

[3.3 混入](#3.3 混入)

[3.3.1 笔记与代码](#3.3.1 笔记与代码)

[3.3.1.1 笔记](#3.3.1.1 笔记)

[3.3.1.2 04_src_mixin混入(合)](#3.3.1.2 04_src_mixin混入(合))

[3.4 插件与scoped样式](#3.4 插件与scoped样式)

[3.4.1 笔记与代码](#3.4.1 笔记与代码)

[3.4.1.1 笔记](#3.4.1.1 笔记)

[3.4.1.2 05_src_插件](#3.4.1.2 05_src_插件)

[3.4.1.3 06_src_scoped样式](#3.4.1.3 06_src_scoped样式)

[3.5 Todo-list案例](#3.5 Todo-list案例)

[3.5.1 组件化编码流程(通用)](#3.5.1 组件化编码流程(通用))

[3.5.2 笔记与代码](#3.5.2 笔记与代码)

[3.5.2.1 笔记](#3.5.2.1 笔记)

[3.5.2.2 07_src_TodoList案例](#3.5.2.2 07_src_TodoList案例)

[3.5.2.3 08_浏览器本地存储](#3.5.2.3 08_浏览器本地存储)

[3.5.2.4 09_src_TodoList_本地存储](#3.5.2.4 09_src_TodoList_本地存储)

[3.6 Vue中的自定义事件](#3.6 Vue中的自定义事件)

[3.6.1 绑定事件监听](#3.6.1 绑定事件监听)

[3.6.2 触发事件](#3.6.2 触发事件)

[3.6.3 笔记与代码](#3.6.3 笔记与代码)

[3.6.3.1 笔记](#3.6.3.1 笔记)

[3.6.3.2 10_src_组件自定义事件](#3.6.3.2 10_src_组件自定义事件)

[3.6.3.3 11_src_TodoList_自定义事件](#3.6.3.3 11_src_TodoList_自定义事件)

[3.7 全局事件总线](#3.7 全局事件总线)

[3.7.1 理解](#3.7.1 理解)

[3.7.2 指定事件总线对象](#3.7.2 指定事件总线对象)

[3.7.3 绑定事件](#3.7.3 绑定事件)

[3.7.4 分发事件](#3.7.4 分发事件)

[3.7.5 解绑事件](#3.7.5 解绑事件)

[3.7.6 笔记与代码](#3.7.6 笔记与代码)

[3.7.6.1 笔记](#3.7.6.1 笔记)

[3.7.6.2 12_src_全局事件总线](#3.7.6.2 12_src_全局事件总线)

[3.7.6.3 13_src_TodoList_事件总线](#3.7.6.3 13_src_TodoList_事件总线)

[3.8 消息订阅与发布](#3.8 消息订阅与发布)

[3.8.1 理解](#3.8.1 理解)

[3.8.2 使用PubSubJS](#3.8.2 使用PubSubJS)

[3.8.3 笔记与代码](#3.8.3 笔记与代码)

[3.8.3.1 笔记](#3.8.3.1 笔记)

[3.8.3.2 14_src_消息订阅与发布](#3.8.3.2 14_src_消息订阅与发布)

[3.8.3.3 15_src_TodoList_pubsub](#3.8.3.3 15_src_TodoList_pubsub)

[3.8.3.4 16_src_TodoList_nextTick(编辑功能)](#3.8.3.4 16_src_TodoList_nextTick(编辑功能))

[3.9 过度与动画](#3.9 过度与动画)

[3.9.1 效果](#3.9.1 效果)

[3.9.2 vue动画的理解](#3.9.2 vue动画的理解)

[3.9.3 基本过渡动画的编码](#3.9.3 基本过渡动画的编码)

[3.9.4 笔记与代码](#3.9.4 笔记与代码)

[3.9.4.1 笔记](#3.9.4.1 笔记)

[3.9.4.2 17_src_过度与动画](#3.9.4.2 17_src_过度与动画)

[3.9.4.3 18_src_TodoList_动画](#3.9.4.3 18_src_TodoList_动画)


3.1 初始化脚手架

3.1.1 说明

Vue脚手架即Vue CLI(command line interface,命令行接口工具,简称脚手架)

3.1.2 具体步骤

配置npm淘宝镜像:npm config set registry https://registry.npm.taobao.org

3.1.3 模板项目的结构

3.1.4 笔记与代码

3.1.4.1 笔记

3.1.4.2 01_src_分析脚手架

3.2 ref与props

3.2.1 ref

3.2.2 props

3.2.3 笔记与代码

3.2.3.1 笔记

3.2.3.2 02_src_ref属性

3.2.3.3 03_src_props配置

3.3 混入

3.3.1 笔记与代码

3.3.1.1 笔记

3.3.1.2 04_src_mixin混入(合)

3.4 插件与scoped样式

3.4.1 笔记与代码

3.4.1.1 笔记

3.4.1.2 05_src_插件

3.4.1.3 06_src_scoped样式

3.5 Todo-list案例

快速打开markdown文件插件:Open in External App

3.5.1 组件化编码流程(通用)

3.5.2 笔记与代码

3.5.2.1 笔记

3.5.2.2 07_src_TodoList案例

3.5.2.3 08_浏览器本地存储

localStorage

sessionStorage

3.5.2.4 09_src_TodoList_本地存储

3.6 Vue中的自定义事件

3.6.1 绑定事件监听

3.6.2 触发事件

3.6.3 笔记与代码

3.6.3.1 笔记

3.6.3.2 10_src_组件自定义事件

3.6.3.3 11_src_TodoList_自定义事件

3.7 全局事件总线

3.7.1 理解

3.7.2 指定事件总线对象

3.7.3 绑定事件

3.7.4 分发事件

3.7.5 解绑事件

3.7.6 笔记与代码

全局事件总线原理图:

3.7.6.1 笔记

3.7.6.2 12_src_全局事件总线

3.7.6.3 13_src_TodoList_事件总线

3.8 消息订阅与发布

3.8.1 理解

3.8.2 使用PubSubJS

3.8.3 笔记与代码

消息订阅与发布原理图:

3.8.3.1 笔记

3.8.3.2 14_src_消息订阅与发布

3.8.3.3 15_src_TodoList_pubsub

3.8.3.4 16_src_TodoList_nextTick(编辑功能)

3.9 过度与动画

3.9.1 效果

3.9.2 vue动画的理解

3.9.3 基本过渡动画的编码

3.9.4 笔记与代码

3.9.4.1 笔记

3.9.4.2 17_src_过度与动画

3.9.4.3 18_src_TodoList_动画

相关推荐
不听话坏7 小时前
Ignition篇(下 一) 动态执行前的事情
开发语言·前端·javascript
likeyi078 小时前
require 和 import的区别
开发语言·前端
pany8 小时前
做 AI 友好的开源 Vue3 模板 🌈
前端·vue.js·ai编程
小二·8 小时前
React 19 + Next.js 15 现代前端开发实战:App Router / Server Components / 流式渲染
前端·javascript·react.js
daols889 小时前
vue 甘特图 vxe-gantt 小时视图设置日期轴每间隔 3 个小时
vue.js·甘特图·vxe-gantt
谙忆102410 小时前
前端图片直传对象存储:OSS/S3 预签名 URL、STS 临时凭证与回调校验
前端
CHNE_TAO_EMSM11 小时前
Android studio 打开文件时自动下载源码
前端·javascript·android studio
一孤程12 小时前
Airtest自动化测试第五篇:小程序与Web测试——跨平台自动化全覆盖
前端·自动化测试·小程序·自动化·测试·airtest
IT_陈寒12 小时前
SpringBoot自动配置不是你以为的那样的智能
前端·人工智能·后端
yume_sibai13 小时前
大屏数据可视化 - 边框红绿呼吸灯实现详解
前端·信息可视化·typescript