Vue
文章平均质量分 95
HHHBan
小学生
展开
-
Vue学习笔记09:Vuex的基本使用
文章目录一、Vuex 概述1. Vuex 是什么2. Vuex 好处与用处二、Vuex 的核心概念三、Vuex 的基本使用1. 安装配置 Vuex2. state2.1 定义数据2.2 使用数据3. mutations3.1 定义 mutations3.2 使用 mutations4. actions4.1 定义 actions4.2 使用 actions5. getters5.1 定义getters5.2 使用getters6. modules6.1 定义modules6.2 使用带命名空间的模块四、Vu原创 2021-11-27 16:33:13 · 855 阅读 · 0 评论 -
Vue学习笔记08:Vue Router 路由的基本使用
文章目录一、前端路由的概念与原理1. 什么是路由2. 前端路由的工作方式3. 实现简易的前端路由二、vue-router 的基本使用1. 什么是 vue-router2. vue-router 4.x 的基本使用步骤2.1 在项目中安装 vue-router2.2 定义路由组件2.3 声明路由链接和占位符2.4 创建路由模块三、vue-router 的高级用法1. 路由重定向2. 路由高亮3. 嵌套路由3.1 声明子路由链接和子路由占位符3.2 通过 children 属性声明子路由规则4. 动态路由匹配4原创 2021-11-25 18:17:00 · 497 阅读 · 0 评论 -
Vue学习笔记07:ref 、动态组件、插槽、自定义指令
文章目录一、ref 引用1. 什么是 ref 引用2. 引用 DOM 和组件实例3. this.$nextTick(cb) 方法二、动态组件1. 什么是动态组件2. 动态组件渲染和 keep-alive三、插槽1. 什么是插槽2. 插槽的基础用法3. 具名插槽4. 作用域插槽4.1 表格使用作用域插槽四、自定义指令1. 什么是自定义指令2. 声明私有自定义指令的语法3. 声明全局自定义指令的语法4. updated 函数5. 指令的参数值五、table 案例1. 案例效果2. 实现步骤3. 搭建项目基本结构原创 2021-11-24 21:23:52 · 955 阅读 · 0 评论 -
Vue学习笔记06:监听器、生命周期、数据共享
文章目录一、watch 侦听器1. 什么是 watch 侦听器2. watch 侦听器的基本语法3. axios + watch 检测用户名是否可用4. immediate 选项5. deep 选项6. 计算属性 vs 侦听器二、组件的生命周期1. 组件运行的过程2. 如何监听组件的不同时刻3. 组件中的生命周期函数4. 完整的生命周期图示三、组件之间的数据共享(重点)1. 组件之间的关系2. 父子组件之间的数据共享2.1 父组件向子组件共享数据2.2 子组件向父组件共享数据2.3 父子组件之间数据的双向同原创 2021-11-23 21:39:14 · 923 阅读 · 0 评论 -
Vue学习笔记05:props、计算属性、自定义事件
一、props 验证1. 什么是 props 验证指的是:在封装组件时对外界传递过来的 props 数据进行合法性的校验,从而防止数据不合法的问题。使用数组类型的 props 节点的缺点:无法为每个 prop 指定具体的数据类型。2. 对象类型的 props 节点使用对象类型的 props 节点,可以对每个 prop 进行数据类型的校验,示意图如下:对象类型的 props 节点提供了多种数据验证方案,例如:基础的类型检查可以直接为组件的 prop 属性指定基础的校验类型,从而防止组原创 2021-11-22 23:00:37 · 1823 阅读 · 0 评论 -
Vue学习笔记04:组件思想、vite、vue-cli
文章目录一、单页面应用程序1. 什么是单页面应用程序2. 单页面应用程序的特点3. 单页面应用程序的优点4. 单页面应用程序的缺点5. 如何快速创建 vue 的 SPA 项目二、vite 的基本使用1. 什么是 vite2. 创建 vite 的项目3. 梳理项目的结构4. vite 项目的运行流程三、vue-cli 的基本使用1. 什么是 vue-cli2. 安装 vue-cli2.1 解决 Windows PowerShell 不识别 vue 命令的问题3. 基于 vue ui 创建 vue 项目4. 基原创 2021-11-21 22:03:06 · 808 阅读 · 0 评论 -
Vue学习笔记03:Vue基础入门
Vue 基础入门一、Vue 简介1. 什么是 vue官方给出的概念:Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。渐进式框架:Vue 不强求你一次性接受并使用它的全部功能特性,我们可以在项目中一点点来引入和使用 Vue,而不是用 Vue 的一个小功能,就必须用 Vue 来开发整个项目。1.1 解读核心关键词:构建用户界面前端开发者最主要的工作,就是为网站的使用者(又称为:网站的用户)构建出美观、舒适、好用的网页。1.2 构建用户界面的传统方式在传统原创 2021-11-20 19:45:48 · 1027 阅读 · 0 评论 -
Vue学习笔记02:前端工程化、webpack
前端工程化与 webpack一、前端工程化1. 小白眼中的前端开发 vs 实际的前端开发小白眼中的前端开发:会写 HTML + CSS + JavaScript 就会前端开发需要美化页面样式,就拽一个 bootstrap 过来需要操作 DOM 或发起 Ajax 请求,再拽一个 jQuery 过来需要快速实现网页布局效果,就拽一个 Layui 过来实际的前端开发:模块化(js 的模块化、css 的模块化、资源的模块化)组件化(复用现有的 UI 结构、样式、行为)规范化(目录结构原创 2021-11-19 23:24:38 · 524 阅读 · 0 评论 -
Vue学习笔记01:ES6模块化与异步编程
ES6模块化与异步编程高级用法一、ES6 模块化1. 回顾:node.js 中如何实现模块化node.js 遵循了 CommonJS 的模块化规范。其中:导入其它模块使用 require() 方法模块对外共享成员使用 module.exports 对象模块化的好处:大家都遵守同样的模块化规范写代码,降低了沟通的成本,极大方便了各个模块之间的相互调用,利人利己。2. 前端模块化规范的分类在 ES6 模块化规范诞生之前,JavaScript 社区已经尝试并提出了 AMD、CMD、Common原创 2021-11-18 16:17:52 · 448 阅读 · 0 评论