vue
mr.啄木鸟
捣鼓点什么
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
vue模板编译
弄懂vue模板编译需要弄清编译的目的 什么时候编译 编译过程编译的目的我们知道,html代码可以直接书写template字符串,也可以写render函数,那么template和render有什么关系?new Vue({ el: '#app', template: '<div>this is template</div>', render(createElement) {原创 2020-10-31 18:35:58 · 1116 阅读 · 0 评论 -
vue-router原理
弄清vue-router大概原理可从以下3个问题出发如何监听url变化 vue插件使用,以及Vue.use(VueRouter)做了什么 url变化如何通知组件更新如何监听url变化首先我们要知道前端路由,前端路由、后端路由都是一种相对概念,就是为了区分而起了个名字,就好比客户端渲染和服务端渲染,他们都是成对出现的,在没有客户端渲染的时候应该没人会把从服务器获取完整的html文档叫服务端渲染把,前端路由也是如此。前端路由的特点就是,相对后端路由,改变url,页面无需刷新。前端路由有两种原创 2020-10-29 22:19:58 · 573 阅读 · 1 评论 -
vue之响应式原理
响应式,顾名思义,一个地方改变,触发另一个地方改变,在vue的体现就是,data的某个属性值改变,自动触发了视图更新说到响应式,可以谈谈观察者模式观察者模式是一种实现一对多关系解耦的行为设计模式。它主要涉及两个角色:观察目标、观察者class Watcher { constructor(name) { this.name = name; } receiveMessage(message) { console.log(`${this.n原创 2020-10-28 10:35:18 · 317 阅读 · 0 评论 -
关于vue列表渲染的key理解
关于vue v-for 里的key,文章都一大把了,但是,并不是每个人都说的准确或说到位了,这里谈谈个人理解。key的作用,就是为了帮助比较前后vnode是不是相同vnode。如果匹配到了相同节点,那就可以直接复用。但是用什么作为key呢,我们讨论一下以下几种情况不加key 用随机数 用数组索引 用数组元素唯一属性,如id讨论前我们先看一下vue对于是否为sameVnode的判断逻辑,这里我们关注a.key===b.key就可以了,至于更详细的diff过程可以看看这篇详解vue d.原创 2020-10-18 12:50:58 · 882 阅读 · 0 评论 -
vue实现简单的分页功能
分页其实就是对一组数据分组!而vue又刚好是数据驱动,所以我们只需要关注数据层就行了!分页开始--->变量: data() { return { // 假设这是后台传来的数据来源 data: [], // 所有页面的数据 totalPage: [], // 每页显示数量 pageSize: 5,...原创 2018-09-15 16:09:54 · 57003 阅读 · 25 评论 -
vue实现简单的前端分页功能
思路:假设每页显示10条,一共100条,那么共10页,第一页显示1-10条数据,第二页显示11-20条数据...以此类推是不是有思路了代码:let productList = [];for (let i = 0; i < 99; i++) { productList.push({ name: "第" + i + "瓶奶酪", c...原创 2018-11-16 15:39:41 · 20265 阅读 · 33 评论
分享