Vue
关注
分享
扫一扫
文章平均质量分 53
枫叶在飘呀
学无止境
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
Vue中key原理和作用
key的原理和作用 key 作用 :用来作为数据的唯一标识 key原理：vue中的key其实存在着一种diff算法，也正是这个diff算法，使得页面在被渲染时更加高效，什么是diff算法，其实是一种虚拟DOM算法，就是将新的虚拟DOM与重新渲染的虚拟DOM进行一个对比 vue中的key属性就是按照这个key的值来一一对比。如果匹配到一样的Node节点会便不会重新使用新的虚拟DOM进行渲染，而是采用原有虚拟DOM结构。 情景一 在使用v-for时不使用key属性（其实vue会将其默认将索引作为原创 2021-10-28 22:25:55 · 2011 阅读 · 1 评论 -
Vue中的插槽slot使用
Vue中的插槽slot 1.首先在了解这个插槽这个概念之前，我想通过一个图片来更加形象说一下。 下面简单说一下这个图片，我们可以看到父组件中包含了各个大小相同的子组件，这些子组件中的布局上面的布局是一样的，唯一不相同的是，不同的形状。 首先我们会想着先做好一个子组件，比如说是cpn1，这个组件做好后，我复制两份然后再修改他们不同的地方，这样作其实看来也是可以的，但是这样做导致了组件的复用性是特别差的. 然后我们用到slot插槽后，就可以这样来做：我可以单单创建一个子组件然后用slot标签给布局不同的部分提原创 2021-05-18 14:42:02 · 197 阅读 · 1 评论 -
Vue局部组件和全局组件
Vue中的父组件和子组件 Vue中我们在定义组件时，需要先创建一个组件构造器，然后再跟据实际情况，采用局部组件定义和全局组件定义。 首先我先说一下为什么使用自定义组件，我们再写前端代码时候会遇到代码重复性高，或者说是代码冗余，观赏性不美观，我简单举个例子： 我们想让这个div中的内容重复出现多次，我们会多复制几行 运行结果： 当我们想着多复制几行，会这样做 <script type="text/javascript"> //步骤1.组件构造器 const cpn = V原创 2021-05-09 00:16:20 · 535 阅读 · 0 评论 -
用Vue.js实现一个简易的购物车
基于Vue.js实现一个简易的购物车 一、该案例主要实现功能功能 1.可以对商品进行更改数量，加减按钮。 （初始定义的数量为1，加操作正常进行，减操作当数量小于0时，减操作按钮不得使用）。 2.可以对每一项商品进行删除操作，当商品删除完后，会有一个显示购物车为空的提示字 下面就来展示一下代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>书籍购物车</tit原创 2021-05-06 10:33:20 · 4132 阅读 · 0 评论