Vue2异步批量更新与computed、watcher原理实现

2020-08-07
阅读 12 分钟
6.5k
所以在实现生命周期前,我们需要实现Vue.mixin()这个全局的方法,将混入的所有生命周期钩子进行合并之后再到合适的时机去执行生命周期的各个钩子。我们可以将全局的api放到一个单独的模块中,如:

Vue2组件挂载与对象数组依赖收集

2020-08-06
阅读 12 分钟
5.3k
渲染的入口就是调用Vue实例的$mount()方法,其会接收一个选择器名作为参数,Vue进行模板渲染的时候,所使用的模板是有一定优先级的:① 如果用户传递的options对象中包含render属性,那么就会优先使用用户配置的render()函数中包含的模板进行渲染;② 如果用户传递的options对象中不包含render属性,但是包含template属性,...

Vue2响应式原理与实现

2020-08-04
阅读 6 分钟
3.3k
Vue本质上是一个暴露在全局的名为Vue的函数,在使用的时候通过new这个Vue函数来创建一个Vue实例,并且会传入一个配置对象。Vue函数内需要做的事情就是根据传入的配置对象进行初始化。如:

Vue3响应式原理与reactive、effect、computed实现

2020-07-26
阅读 14 分钟
10.4k
Vue响应式系统的核心依然是对数据进行劫持,只不过Vue3采样点是Proxy类,而Vue2采用的是Object.defineProperty()。Vue3之所以采用Proxy类主要有两个原因:

Docker基本使用以及实战部署Vue项目

2020-03-22
阅读 13 分钟
8.2k
Docker 是一个开源的应用容器引擎,基于Go 语言并遵从 Apache2.0 协议开源。Docker 可以让开发者打包他们的应用以及依赖包到一个轻量级、可移植的容器中,然后发布到任何流行的 Linux 机器上,也可以实现虚拟化。

从零开始实现一个vuex插件

2020-03-16
阅读 6 分钟
2.2k
要想自己实现一个vuex插件,就必须先了解一下vuex插件的基本使用,我们在使用vuex的时候,通常会定义一个store.js文件,里面主要就是干了以下几件事:

axios的封装和api的管理

2020-03-14
阅读 11 分钟
8.3k
Content-Type 用于规定客户端通过http或https协议向服务器发起请求时,传递的请求体中数据的编码格式。因为get请求是直接将请求数据以键值对通过&号连接(key1=value1&key2=value2)的方式附加到url地址后面,不在请求体中,所以get请求中不需要设置Content-Type。通过浏览器抓取get请求数据可以发现其请求头中并...

vue-cli脚手架初始化项目简要分析

2019-12-20
阅读 5 分钟
2.2k
我们通过vue的脚手架工具,执行vue create vue-demo 可以生成最初项目。从最初的脚手架初始化项目中,我们可以看到项目根目录下主要有一个public目录和src目录,其中public目录下主要就是一个index.html文件,这个index.html文件的作用就是为当前vue项目提供一个html模板,因为Vue实例要想挂载,即要想显示到html模板上...

Vue数据双向绑定原理和实现

2019-12-18
阅读 10 分钟
14k
Vue实现数据双向绑定主要利用的就是: 数据劫持和发布订阅模式。所谓发布订阅模式就是,定义了对象间的一种一对多的关系,让多个观察者对象同时监听某一个主题对象,当一个对象发生改变时,所有依赖于它的对象都将得到通知。所谓数据劫持,就是利用JavaScript的访问器属性,即Object.defineProperty()方法,当对对象的属...

从零实现一个日历组件

2019-10-29
阅读 14 分钟
4.8k
日历组件主要是由一个文本输入框组成,点击文本输入框后会在文本框下方显示日历面板,日历面板包含三部分: 头部区(主要显示当面日历面板对应的年月以及四个年月上下切换按钮)、内容区(显示星期、以及42天)、底部区(今天快捷按钮,点击可以直接跳转到今天),同时点击日历面板外部可以关闭日历面板。

详解虚拟DOM并实现DOM-DIFF算法

2019-10-24
阅读 20 分钟
2.6k
所谓虚拟DOM,就是用JavaScript对象的方式去描述真实DOM。由于真实DOM的创建、修改、删除会造成页面的重排和重绘,频繁操作真实DOM会影响页面的性能,页面中会有数据、样式的更新,操作真实DOM是不可避免的,而虚拟DOM的产生是为了最大限度的减少对真实DOM的操作,因为虚拟DOM可以将真实DOM操作映射为JavaScript对象操作...

uni-app相关知识总结

2019-10-11
阅读 10 分钟
6.6k
uni-app默认会提供一个导航栏,即小程序的导航栏,我们不需要进行任何的配置就会显示,默认导航栏的配置同微信小程序,只不过微信小程序的组件是分为.wxml、.wxss、.js、.json四个文件组成,而uni-app的组件则只有一个.vue文件(其中包含了html、css、js),其中并未包含.json的相关内容,那么.json配置写在哪里呢?.json...

uni-app开发一个小视频应用(三)

2019-10-05
阅读 5 分钟
2.4k
首页导航栏上有一个城市选择页面,点击会切换到城市页面,切换到城市页面的过程中并没有路由的跳转,而只是tab的切换,所以需要将城市页面设置为tabBar页面,即将城市页面添加到tabBar的list数组中。

uni-app开发一个小视频应用(二)

2019-10-01
阅读 11 分钟
7k
上篇文章,我们已经实现了首页的头部导航栏组件、底部的tabBar导航栏组件、中间的视频列表组件以及视频列表组件中的视频播放组件,传入视频列表渲染后已经可以上下滑动进行视频切换和播放,接下来我们将完成首页的剩余部分,左侧信息栏组件、右侧图标栏组件,以及完善视频切换动画、播放控制等功能。

uni-app开发一个小视频应用(一)

2019-09-30
阅读 10 分钟
16.2k
uni-app 是一个使用 Vue.js 开发所有前端应用的框架,是一种终极的跨平台解决方案,这里的平台,主要指的是App平台(android、ios)、小程序平台、H5平台。开发者编写一套代码,可发布到iOS、Android、H5、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉)等多个平台。uni-app将常用的组件和api进行了跨平台封装,并且保...

Vue常见面试题精讲【持续更新】

2019-09-27
阅读 18 分钟
5.4k
v-if 是条件渲染指令,控制的是组件是否创建(渲染),值为true则渲染该组件,值为false则不渲染该组件,对应Html元素则不会存在于浏览器的html文档中,即打开浏览器调试工具找不到该组件对应的渲染结果。v-show控制的是组件是否可见,并且是通过css样式的display属性来控制组件的显示与隐藏,所以其值无论是true还是false...

mpvue开发微信小程序基础知识

2019-09-22
阅读 7 分钟
5.4k
mpvue 是一个使用 Vue.js 开发小程序的前端框架。框架基于 Vue.js 核心,mpvue 修改了 Vue.js 的 runtime 和 compiler 实现,使其可以运行在小程序环境中,从而为小程序开发引入了整套 Vue.js 开发体验。mp 即 mini program 的缩写。

从零开始实现一个vue-router插件

2019-08-28
阅读 13 分钟
3.3k
要想自己实现一个vue-router插件,就必须先了解一下vue-router插件的基本使用,我们在使用vue-router的时候,通常会定义一个router.js文件,里面主要就是干了以下几件事:

Vue路由之JWT身份认证

2019-08-25
阅读 4 分钟
8.8k
JSON Web Token(JWT)是目前最流行的跨域身份验证解决方案,相较于session机制,服务器就不需要保存任何 session 数据了,也就是说,服务器变成无状态了,从而比较容易实现扩展。JWT 实际上是一个令牌(Token),服务器会将一些元数据、指定的secret进行签名并生成token,并返回给客户端,客户端得到这个服务器返回的令...

使用typescript构建Vue应用

2019-08-25
阅读 5 分钟
4.5k
使用typescript构建Vue应用和使用js一样,都是通过vue-cli去初始化并创建一个vue项目,只不过使用typescript构建的时候要在脚手架问卷操作的时候勾选上typescript选项。

从零开始实现一个Vue级联组件

2019-08-19
阅读 6 分钟
12.5k
本文实现的是一个省、市、县...多级联动组件,当组件渲染完成后默认会加载出所有的省名称,当用户点击某个省的名称后,右边会自动添加一列显示该省下对应的市名称列表,当用户点击某个市后,右边又会自动添加一列显示该市下对应的县名称列表,同时支持级联列表的打开和关闭。

Vue自定义指令

2019-08-16
阅读 4 分钟
3.4k
Vue指令主要用于需要进行一些DOM操作的时候,通过Vue指令将DOM操作进行封装。使用指令的时候分为左右两部分,等号左边是指令名(v-model)和修饰符(.lazy),等号右边是指令表达式(age),指令表达式虽然是一个单纯的字符串,但是指令表达式的值却是当前组件上的同名属性对应的值,上面input输入框中显示的将是this.age的值

Vue组件基础与通信

2019-08-15
阅读 7 分钟
2.3k
vue cli 3.0之前安装的是vue-cli模块,vue cli 3.0之后安装的是@vue/cli模块。如果已经全局安装了旧版本的 vue-cli , 那么需要先卸载vue-cli,再全局安装@vue/cli虽然安装的是vue cli,但是执行的命令仍然是vue

详解Vue服务端渲染

2019-08-04
阅读 16 分钟
6.9k
一、服务端渲染 - 简介所谓服务端渲染就是将代码的渲染交给服务器,服务器将渲染好的html字符串返回给客户端,再由客户端进行显示。服务器端渲染的优点有利于SEO搜索引擎优化,因为服务端渲染是将渲染好的html字符串返回给了客户端,所以其可以被爬虫爬取到;加快首屏渲染时间,不会出现白屏;服务器端渲染的缺点SSR会占...