![](https://img-blog.csdnimg.cn/20201014180756918.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
Vue学习总结与记录
Cc.*
前端菜鸡一枚
展开
-
【vant】Toast 轻提示的简单使用
【vant】Toast 轻提示的简单使用这个文档是讲述 vant 插件的 Toast 轻提示简单上手使用前提:确保已经下载好了 vant 插件在需要使用的页面引入import Vue from 'vue'import {Toast} from 'vant'加载该中间件Vue.use(Toast)在 created 钩子函数内直接使用const toast = Toast....原创 2020-04-08 13:13:43 · 7344 阅读 · 0 评论 -
vue axios的拦截器配合路由守卫实现前端鉴权认证登录
axios 的拦截器配合路由守卫实现前端鉴权认证登录配置反向代理解决跨域问题vue.config.jsdevServer: { proxy:{ //代理 "/info":{ target:"http://47.96.0.211:3000", changeOrigin:true, pat...原创 2020-04-01 00:57:00 · 531 阅读 · 0 评论 -
vue 使用 swiper 配合自定义指令实现轮播图插件封装
使用 swiper 配合自定义指令实现轮播图插件封装前情提要之前有提到过 swiper 插件的使用,在vue当中,可以在created钩子函数获取之中完成轮播图数据的获取,一共有以下三种实现实例化的方法然后在updated钩子函数中实现轮播图事件的实例化。然后使用this.$nextTick()的方法,里面放轮播实例化的回调函数this.$nextTick()将回调延迟到下次 D...原创 2020-03-31 23:20:46 · 686 阅读 · 0 评论 -
Vue-router详解
Vue-router含义SPA应用(single page application):单页面应用单页面应用就是用户通过某些操作更改地址栏url之后,动态的进行不同模板内容的无刷新切换,用户体验好。Vue中会使用官方提供的vue-router插件来使用单页面,原理就是通过检测地址栏变化后将对应的路由组件进行切换(卸载和安装)与MPA的对比MPASPA应用构成由...原创 2020-03-30 00:30:48 · 230 阅读 · 0 评论 -
Vue-cli的安装与基本操作
Vue-cli的安装与基本使用目录Vue-cli的安装与基本使用安装以及脚手架的搭建全局安装通过npm进行全局安装通过yarn进行全局安装检测是否安装成功使用脚手架创建项目删除预设值或更改默认下载引擎Vue-cli 使用时候遇到的各种问题eslint检测问题关闭eslint检查,浏览器出错遮罩关闭eslint某一个验证proxy代理配置样式相关问题scoped穿透::v-deep/deep/安...原创 2020-03-29 14:02:39 · 235 阅读 · 0 评论 -
Vue自定义指令
Vue自定义指令自定义指令注册全局注册// 注册一个全局自定义指令 `v-focus`Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el) { // 聚焦元素 el.focus() }})局部注册directives: { focus: { // 指令的...原创 2020-03-26 00:27:00 · 120 阅读 · 0 评论 -
Vue过渡 & 动画
Vue过渡 & 动画在进入/离开的过渡中,会有 6 个 class 切换v-enter:定义进入过渡的开始状态。在元素被插入之前生效,在元素被插入之后的下一帧移除。v-enter-active:定义进入过渡生效时的状态。在整个进入过渡的阶段中应用,在元素被插入之前生效,在过渡/动画完成之后移除。这个类可以被用来定义进入过渡的过程时间,延迟和曲线函数。v-enter-to:2.1...原创 2020-03-25 22:05:23 · 185 阅读 · 0 评论 -
vue生命周期
vue生命周期与钩子函数文章目录vue生命周期与钩子函数初始化阶段beforeCreatecreatedbeforeMountmounted运行阶段beforeUpdateupdated销毁阶段beforeDestroydestroyed小案例组件的创建到销毁的一系列过程叫做组件的生命周期。先来一张Vue官网的图[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(im...原创 2020-03-25 13:18:07 · 121 阅读 · 0 评论 -
Vue组件之间的通信
Vue组件之间的通信父组件给子组件传递数据子组件需要利用 props 的属性来确定自己的预期数据中间有- 需要写出驼峰的形式来接收如果子组件没有通过 props 接受传递过来的数据,则数据就会以自定义属性的形式放在儿子最外层的根元素上面props和data里面的数据,必须要通过this才可以访问到<div id="app"> <father></...原创 2020-03-25 01:22:09 · 136 阅读 · 0 评论 -
Vue中的虚拟DOM
Vue中的虚拟DOM背景众所周知,在网页中最大的开销就是DOM操作,DOM很慢而且非常庞大。原生 js 或 jq 操作DOM时,浏览器会从构建DOM树开始从头到尾执行一遍流程。在一次操作中,我需要更新10个节点,浏览器不知道共有10个节点要更新,就会执行10次更新操作,浪费性能,使页面出现卡顿,影响用户体验。于是,就出现了虚拟DOM虚拟DOM的流程在内存中生成一颗虚拟dom树将内...原创 2020-03-24 00:47:33 · 181 阅读 · 0 评论 -
vue基本语法
vue基本语法本文将涉及以下知识点:vue的简要含义模板语法各种花里胡哨的指令watch监听conputed计算属性mixins混入component组件filter过滤器三种数据请求方式目录:vue基本语法vue基本语法vue简要含义特点mvvm模式(面试常问)双向数据绑定含义双向数据绑定原理(面试常问)Vue的使用Vue模板语法(1)插值指令v-fortempla...原创 2020-03-22 23:50:32 · 162 阅读 · 0 评论