摘要：
一. TypeScript简介 1. JavaScript痛点 (1). 优秀的JavaScript没有缺点吗？ A. 比如ES5以及之前的使用的var关键字关于作用域的问题； B. 比如最初JavaScript设计的数组类型并不是连续的内存空间； C. 比如直到今天JavaScript也没有加入类 阅读全文
posted @ 2021-10-28 09:02
Yaopengfei
阅读(982)
评论(1)
推荐(0)
摘要：
一. Module说明 1. 什么是Module？ 由于使用单一状态树，应用的所有状态会集中到一个比较大的对象，当应用变得非常复杂时，store 对象就有可能变得相当臃肿； 为了解决以上问题，Vuex 允许我们将 store 分割成模块（module）； 每个模块拥有自己的 state、mutati 阅读全文
posted @ 2021-10-26 09:32
Yaopengfei
阅读(1243)
评论(1)
推荐(0)
摘要：
一. Vuex简介 1. 简介 (官网地址：https://next.vuex.vuejs.org/zh/index.html 在Vue2中使用的详见：https://www.cnblogs.com/yaopengfei/p/14571316.html 本节采用的版本号【4.0.2】) Vuex 是 阅读全文
posted @ 2021-10-22 15:36
Yaopengfei
阅读(1545)
评论(1)
推荐(0)
摘要：
一. router-link的v-slot （需要复习一下插槽的相关用法：https://www.cnblogs.com/yaopengfei/p/15338752.html） 二. router-view的v-slot 了解即可 三. 动态增删路由 1. 添加路由 (1). 添加1级路由 使用ad 阅读全文
posted @ 2021-10-20 09:59
Yaopengfei
阅读(5065)
评论(2)
推荐(1)
摘要：
一. 简介和基本用法 1. 简介 (官网地址：https://next.router.vuejs.org/zh/introduction.html) Vue Router 是 Vue.js 的官方路由。它与 Vue.js 核心深度集成，让用 Vue.js 构建单页应用变得轻而易举。功能包括： 嵌套路 阅读全文
posted @ 2021-10-16 10:53
Yaopengfei
阅读(1524)
评论(2)
推荐(0)
摘要：
一. render/h函数(了解) 详见：https://v3.cn.vuejs.org/guide/render-function.html#dom-树 二. jsx(了解) Vue3.x版本创建的项目使用jsx已经不需要配置babel了。 代码分享： <script> import HelloW 阅读全文
posted @ 2021-10-13 15:15
Yaopengfei
阅读(3566)
评论(1)
推荐(1)
摘要：
一. 生命周期钩子 1. 说明 setup 可以用来替代 data 、 methods 、 computed 、watch 等等这些选项，也可以替代 生命周期钩子。 注：因为 setup 是围绕 beforeCreate 和 created 生命周期钩子运行的，所以不需要显式地定义它们。换句话说，在 阅读全文
posted @ 2021-10-10 21:37
Yaopengfei
阅读(6424)
评论(1)
推荐(0)
摘要：
一. toRefs/toRef 1. 背景 我们都知道reactive处理的对象是响应式的，但是使用ES6的解构语法对reactive对象进行处理，那么之后无论是修改解构后的变量name、age，还是修改reactive返回的原始对象info1，数据都不再是响应式的。 2. 使用 (1). toRe 阅读全文
posted @ 2021-10-05 19:49
Yaopengfei
阅读(648)
评论(1)
推荐(0)
摘要：
一. Vue2.x的mixin和extends 1. mixin简介 (1). 目前我们是使用组件化的方式在开发整个Vue的应用程序，但是组件和组件之间有时候会存在相同的代码逻辑，我们希望对相同的代码逻辑进行抽取。 (2). 在Vue2和Vue3中都支持的一种方式就是使用Mixin来完成： A. M 阅读全文
posted @ 2021-10-02 19:41
Yaopengfei
阅读(2513)
评论(2)
推荐(0)
摘要：
一. 动态组件和keep-alive 1. 背景 比如我们要做一个动态组件的切换，传统的做法是通过v-if进行判断切换，核心代码如下： 2. 动态组件 (1). 基本使用 动态组件是使用 component 组件，通过一个特殊的attribute is 来实现： 代码分享： <template> < 阅读全文
posted @ 2021-09-28 13:41
Yaopengfei
阅读(549)
评论(4)
推荐(0)
摘要：
一. 简介及基本用法 1. 简介 (1). 什么时候使用插槽？ 插槽的使用过程其实是抽取共性、预留不同； 我们会将共同的元素、内容依然在组件内进行封装； 同时会将不同的元素使用slot作为占位，让外部决定到底显示什么样的元素； (2). 如何定义插槽？ 在封装组件中，使用特殊的元素<slot>就可以 阅读全文
posted @ 2021-09-26 16:27
Yaopengfei
阅读(1651)
评论(1)
推荐(0)
摘要：
一. Vue Cli复习 (在Vue2.x章节中，详细整理过，基本没变化，详见：https://www.cnblogs.com/yaopengfei/p/14506321.html) 1. 相关指令 Vue的脚手架就是Vue CLI：CLI是Command-Line Interface, 翻译为命令 阅读全文
posted @ 2021-09-22 15:23
Yaopengfei
阅读(808)
评论(2)
推荐(0)
摘要：
一. webpack本地服务器搭建 1. 为什么要搭建本地服务器？ 我们之前通过【npm run build】，编译相关的代码； 然后需要在浏览器中运行，每次修改修改代码，都需要重新编译运行，很麻烦。我们希望可以做到，当文件发生变化时，可以自动的完成 编译 和 展示 。 2. watch mode模 阅读全文
posted @ 2021-09-21 19:10
Yaopengfei
阅读(398)
评论(1)
推荐(0)
摘要：
一. Babel的使用 1. 为什么要用babel？ 比如我们想使用ES6+的语法，想要使用TypeScript，但是很多旧浏览器又不支持这些新语法，这个时候就需要使用babel了。 Babel是一个工具链，主要用于旧浏览器或者环境中将 ECMAScript 2015+ 代码转换为向后兼容版本的Ja 阅读全文
posted @ 2021-09-18 14:50
Yaopengfei
阅读(1531)
评论(2)
推荐(0)
摘要：
一. 资源模块(asset model) 1. 说明 资源模块(asset module)是一种模块类型，它允许使用资源文件（字体，图标等）而无需配置额外 loader。 (1). 在 webpack 5 之前，通常使用： （需要npm来安装） raw-loader 将文件导入为字符串 url-lo 阅读全文
posted @ 2021-09-17 15:01
Yaopengfei
阅读(816)
评论(1)
推荐(0)
摘要：
一. 简介 1. Webpack背景 (1). 事实上随着前端的快速发展，目前前端的开发已经变的越来越复杂了： A. 比如开发过程中我们需要通过模块化的方式来开发； B. 比如也会使用一些高级的特性来加快我们的开发效率或者安全性，比如通过ES6+、TypeScript开发脚本逻辑， 通过sass、l 阅读全文
posted @ 2021-09-15 15:29
Yaopengfei
阅读(582)
评论(1)
推荐(0)
摘要：
一. 组件入门 1. 命名方式 (1). 使用kebab-case（短横线分割符）【推荐！】 当使用 kebab-case (短横线分隔命名) 定义一个组件时，你也必须在引用这个自定义元素时使用 kebab-case，例如 <my-component-name>； (2). 使用PascalCase 阅读全文
posted @ 2021-09-14 09:29
Yaopengfei
阅读(442)
评论(2)
推荐(0)
摘要：
一. 引用类型赋值 1. 原理 (1). js中对象和数组都是引用类型。 (2). 内存分为两个区域，栈区域 和 堆区域。 (3). 引用类型，在栈区域中存放的堆的二进制地址，这个地址指向 堆区域中的实际值。 (4). 将一个对象A赋值给另一个对象B，实际上是将A的地址赋值给了B，A和B共同指向同一 阅读全文
posted @ 2021-09-13 11:30
Yaopengfei
阅读(233)
评论(6)
推荐(0)
摘要：
一. 分析diff算法中的key 二. Computed源码剖析 1. 剖析 计算属性可以有两种写法，一种直接传入一个方法，另外一种，写set和get对象进行处理？ 问题：Vue内部是如何对我们传入的是一个方法，还是说是一个包含set和get的对象进行处理的呢？ 解析：Vue源码内部做了一个简单的逻 阅读全文
posted @ 2021-09-10 14:57
Yaopengfei
阅读(115)
评论(1)
推荐(0)
摘要：
一. 基本指令 1. v-for 数据准备 data() { return { userInfo: { name: 'ypf', age: 18, school: '北大' }, movies: ["星际穿越", "盗梦空间", "大话西游", "教父", ], userList: [ { name 阅读全文
posted @ 2021-09-09 17:07
Yaopengfei
阅读(2340)
评论(2)
推荐(0)
摘要：
一. 常用指令1 1. Mustache语法(双大括号) 如果我们希望把数据显示到模板（template）中，使用最多的语法是 “Mustache”语法 (双大括号) 的文本插值。并且我们知道，data返回的对象是有添加到Vue的响应式系统中； 当data中的数据发生改变时，对应的内容也会发生更新。 阅读全文
posted @ 2021-09-08 14:54
Yaopengfei
阅读(484)
评论(1)
推荐(1)
摘要：
一. 代码片段制作 （PS：已经迁移到单独的分类下，详见：https://www.cnblogs.com/yaopengfei/p/17162646.html） 1. 复制自己所需要的代码 比如要把下面的代码制作成代码片段 Vue.createApp({ template: '#myApp', da 阅读全文
posted @ 2021-09-06 15:50
Yaopengfei
阅读(462)
评论(1)
推荐(0)
摘要：
一. 简介 1. 说明 Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与现代化的工具链以及各种支持类库结合使用 阅读全文
posted @ 2021-09-02 17:51
Yaopengfei
阅读(2997)
评论(3)
推荐(0)
摘要：
一. SSM分层搭建 1. 项目拆分 将单模块工程项目拆分成 ssm、ssm_controller、ssm_service、ssm_dao、ssm_pojo 多模块工程项目，如下图： 2. ssm父层 新建1个普通的maven项目，删除多余的文件夹，仅保留pom.xml，后续用于统一构建和管理。 3 阅读全文
posted @ 2021-08-27 13:44
Yaopengfei
阅读(390)
评论(2)
推荐(0)
摘要：
一. 事先准备 1. 表结构 2.整合内容 Spring MyBatis Spring整合MyBatis SpringMVC Spring整合SpringMVC 3. pom文件 代码如下： <?xml version="1.0" encoding="UTF-8"?> <project xmlns= 阅读全文
posted @ 2021-08-22 20:07
Yaopengfei
阅读(283)
评论(1)
推荐(0)
摘要：
一. 拦截器 1. 简介 拦截器（ Interceptor）是一种动态拦截方法调用的机制 作用：① 在指定的方法调用前后执行预先设定后的的代码 ②阻止原始方法的执行 核心原理： AOP思想 拦截器链：多个拦截器按照一定的顺序，对原始被调用功能进行增强 PS：拦截器 VS 过滤器 归属不同： Filt 阅读全文
posted @ 2021-08-18 15:51
Yaopengfei
阅读(429)
评论(1)
推荐(0)
摘要：
一. SpringMvc简介 1. 说明 SpringMVC 是一种基于 Java 的实现 MVC 设计模型的请求驱动类型的轻量级 Web 框架，属于SpringFrameWork 的后续产品，已经融合在 Spring Web Flow 中。 SpringMVC 已经成为目前最主流的MVC框架之一， 阅读全文
posted @ 2021-08-11 20:46
Yaopengfei
阅读(323)
评论(1)
推荐(0)
摘要：
。。。。。 阅读全文
posted @ 2021-08-07 17:45
Yaopengfei
阅读(47)
评论(0)
推荐(0)
摘要：
一. Aop简介 1. AOP概念 AOP(Aspect Oriented Programing)面向切面编程，一种编程范式，隶属于软工范畴，指导开发者如何组织程序结构 AOP弥补了OOP的不足，基于OOP基础之上进行横向开发 uOOP规定程序开发以类为主体模型，一切围绕对象进行，完成某个任务先构建 阅读全文
posted @ 2021-08-03 17:48
Yaopengfei
阅读(182)
评论(1)
推荐(0)
摘要：
一. 简介 1. 移动端常见布局 (1). 移动端单独制作 A. 流式布局（百分比布局） B. flex 弹性布局（强烈推荐） C. less+rem+媒体查询布局 D. 混合布局 (2). 响应式 A. 媒体查询 B. bootstarp PS. 流式布局：就是百分比布局，也称非固定像素布局。 通 阅读全文
posted @ 2021-07-30 17:19
Yaopengfei
阅读(2948)
评论(2)
推荐(0)
浙公网安备 33010602011771号