| | | |

2021年10月17日

摘要： Vue 提供了 transition 的封装组件，在下列情形中，可以给任何元素和组件添加进入/ 离开过渡。条件渲染 (使用 v-if)。条件展示 (使用 v-show)。动态组件。组件根节点。语法格式如下： <transition name = "nameoftransition"> <d 阅读全文

posted @ 2021-10-17 12:14 吴裕雄阅读(144) 评论(0) 推荐(0)

VUE学习笔记--动态组件

摘要：让多个组件使用同一个挂载点，并动态切换，这就是动态组件。通过使用保留的 <component> 元素，动态地绑定到它的 is 特性，可以实现动态组件。它的应用场景往往应用在路由控制或者 tab 切换中。 <!DOCTYPE html> <html> <head> <title></title> <m 阅读全文

posted @ 2021-10-17 09:41 吴裕雄阅读(126) 评论(0) 推荐(0)

VUE学习笔记--内容分发

摘要：基础用法标签<slot>会把组件使用上下文的内容注入到此标签所占据的位置上。组件分发的概念简单而强大，因为它意味着对一个隔离的组件除了通过属性、事件交互之外，还可以注入内容。尽管内容分发这个概念看起来极为复杂，而实际上可以简单了解为把HTML标签传入组件的一种方法。所以归根结底，内容分发是一种为阅读全文

posted @ 2021-10-17 09:29 吴裕雄阅读(124) 评论(0) 推荐(0)

VUE学习笔记--组件选项

摘要： Vue 的组件最核心的选项有以下几个：模板（template）初始数据（data）接受的外部参数（props）方法（methods）生命周期钩子函数（lifecycle hooks）组件 props 组件中更重要的是组件间进行通信，选项props是组件中非常重要的一个选项，起到父子组件间阅读全文

posted @ 2021-10-17 09:18 吴裕雄阅读(251) 评论(0) 推荐(0)

2021年10月11日

VUE学习笔记--什么是组件

摘要： <!DOCTYPE html> <html> <head> <title></title> <meta charset="utf-8"/> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script> </head> <bo 阅读全文

posted @ 2021-10-11 23:02 吴裕雄阅读(176) 评论(0) 推荐(0)

VUE学习笔记--指令的注册

摘要：自定义指令的注册分为全局注册和局部注册。语法：Vue.directive(id，definition)。id 是指令的唯一标识，definition 定义对象则是指令的相关属性及钩子函数。全局自定义指令，格式如下 Vue.directive('focus', { // 注册一个全局自定义指令 v 阅读全文

posted @ 2021-10-11 22:43 吴裕雄阅读(431) 评论(0) 推荐(0)

2021年10月10日

VUE学习笔记--MVVM 风格架构

摘要： MVVM 是(Model -View-ViewModel )的简写。它本质上就是 MVC 的改进版。MVVM 就是将其中的 View 的状态和行为抽象化，让我们将视图 UI 和业务逻辑分开。当然这些事 ViewModel 已经帮我们做了，它可以取出 Model 的数据同时帮忙处理 View 中由于阅读全文

posted @ 2021-10-10 22:50 吴裕雄阅读(243) 评论(0) 推荐(0)

VUE学习笔记--事件绑定

摘要： Vue 提供了 v-on 指令来监听 DOM 事件，在事件绑定上，类似原生 JavaScript 的 onclick 事件写法，也是在 HTML 上进行监听。 Vue 中的事件绑定，语法规则： v-on :事件名.修饰符=方法名()│方法名|简单的JS表达式简写:@事件名.修饰符=方法名()|方法阅读全文

posted @ 2021-10-10 22:30 吴裕雄阅读(313) 评论(0) 推荐(0)

VUE学习笔记--模板渲染

摘要：当我们获取到后台数据之后，会按照一定的规则加载到前端写好的模板中，显示在浏览器中，这个过程称之为渲染。条件渲染 1. v-if、v-else 和 v-else-if <!DOCTYPE html> <html xmlns:v-on="http://www.w3.org/1999/xhtml" x 阅读全文

posted @ 2021-10-10 22:06 吴裕雄阅读(175) 评论(0) 推荐(0)

VUE学习笔记--生命周期 Vue

摘要：实例有一个完整的生命周期，也就是从开始创建、初始化数据、编译模板、挂载 Dom、渲染→更新→渲染、卸载等一系列过程，我们称这是 Vue 的生命周期。通俗说就是 Vue 实例从创建到销毁的过程，就是生命周期 beforeCreate：在实例初始化之后，数据观测(data observer) 和 eve 阅读全文

posted @ 2021-10-10 21:38 吴裕雄阅读(50) 评论(0) 推荐(0)