开发猫

Vue 图片加载异常处理 <img :src="imgUrl" @error="errorImg" />errorImg(event) { let img = event.srcElement img.src = require('@/assets/img/noImg.png') img.onerror = null //防止一直跳动}全局注册函数暂时排除使用Vue.use注册函数的方式（多写一些繁琐的代码）公共函数jsfunct..

监听回车键，组件销毁即清空事件 created() { document.onkeydown = e => { if (e.keyCode == 13) { this.submit() } } }, beforeDestroy() { document.onkeydown = '' },

功能：点击导出按钮，提交请求，下载excel文件；第一步：跟后端童鞋确认交付的接口的response header设置了以及返回了文件流。第二步：修改axios请求的responseType为blob，以post请求为例： this.$post({ method: 'post', url: 'api/user/', data: { firstName: 'Fred', lastName:

<template> <div class="clearfix"> <a-upload :action="actionUrl" list-type="picture-card" :file-list="fileList" @preview="handlePreview" @change="handleChange" :before-upload="beforeUpload" :re.

以下是最终的vue版本,光滑流畅,体验感非常好,99%还原京东放大镜甚至更好1.vue版本<template> <div id="magnifier"> <div class="small-box" @mouseover="smallBoxOver" @mousemove="smallBoxMove($event)" @mouseleave="smallLeave" > <.

问题：正常情况下 通过router传参，传递对象或者数组时，F5刷新页面，参数会变成[object object]的格式，导致数据失效解决方法1.在路由跳转前，参数使用JSON.stringify 转化成字符串对象 const param = JSON.stringify(e) this.$router.push({ path: '/PlanInDetail', query: { detail: param } })2.路由跳转到对应页，获取路由参数时，使...

<div class="tab0" id="selector"> </div>1.以下是js原生的scroll 滚动方式 //锚点跳转 goAnchor(selector, index) { document.getElementById(selector).scrollIntoView(true) } //锚点跳转 goAnchor(selector, index) { document...

watch: { // 监听路由变化 $route(to,from){ console.log(to.hash); if(to.hash){ let num=to.hash.split(''); console.log(num) ...

目录深入响应式原理响应式对象Object.definePropertyinitStateproxyobserveObserverdefineReactive依赖收集DepWatcher过程分析派发更新过程分析nextTickJS 运行机制Vue 的实现检测变化的注意事项对象添加属性数组计算属性 VS 侦听属性c...

目录组件化createComponent构造子类构造函数安装组件钩子函数实例化 VNode总结patchcreateComponent总结合并配置外部调用场景组件场景总结组件化Vue.js 另一个核心思想是组件化。所谓组件化，就是把页面拆分成多个组件 (component)，每个组件依赖的 CSS、JavaScript、模板、图片等资源放...

updateVue 的_update是实例的一个私有方法，它被调用的时机有 2 个，一个是首次渲染，一个是数据更新的时候；由于我们这一章节只分析首次渲染部分，数据更新部分会在之后分析响应式原理的时候涉及。_update方法的作用是把 VNode 渲染成真实的 DOM，它的定义在src/core/instance/lifecycle.js中：Vue.prototype._u...

renderVue 的_render方法是实例的一个私有方法，它用来把实例渲染成一个虚拟 Node。它的定义在src/core/instance/render.js文件中：Vue.prototype._render = function (): VNode {const vm: Component = thisconst { render, _parentVnod...

目录数据驱动new Vue 发生了什么Vue 实例挂载的实现数据驱动Vue.js 一个核心思想是数据驱动。所谓数据驱动，是指视图是由数据驱动生成的，我们对视图的修改，不会直接操作 DOM，而是通过修改数据。它相比我们传统的前端开发，如使用 jQuery 等前端库直接修改 DOM，大大简化了代码量。特别是当交互复杂的时候，只关心数据的修改会让代码的逻辑变的非常清晰，因为 DOM ...

Vue.js 源码是基于Rollup构建的，它的构建相关配置都在 scripts 目录下。构建脚本通常一个基于 NPM 托管的项目都会有一个 package.json 文件，它是对项目的描述文件，它的内容实际上是一个标准的 JSON 对象。我们通常会配置script字段作为 NPM 的执行脚本，Vue.js 源码构建的脚本如下：{"script": {...

我们之前提到过 Vue.js 构建过程，在 web 应用下，我们来分析 Runtime + Compiler 构建出来的 Vue.js，它的入口是src/platforms/web/entry-runtime-with-compiler.js：/* @flow */import config from 'core/config'import { warn, cached ...