Vue
关注
分享
扫一扫
敲出真谛
这个作者很懒，什么都没留下…
展开
-
带命名空间的vuex的一些常规用法
带命名空间的Vuex的常规使用介绍原创 2022-01-14 10:10:39 · 602 阅读 · 0 评论 -
组件通讯一 $attrs和$listeners
这一对方法平时用的不多，最近在复盘基础，发现还是有点生疏。一，父组件<!-- Discription: $attrs和$listener, author: ydj, Date: 2021-01-22 15:08:18 --><template> <div> <childB :name="name" :age="age" @click.native="handleClick" v-on:test1="onTest1" v-on:test2="o原创 2021-01-22 17:00:29 · 172 阅读 · 0 评论 -
el-input录入扫码枪数据引起的血案
今天在处理客户需求的时候，客户提出了一个严重性的问题，发现在el-dialog中嵌套el-form,在el-from中有个邮单编码是用扫码枪录入的，需求明确需要录入多条，但是由于我们开发时没有用扫码枪测试该功能，后来客户发现，每次只能录入一个，然后路由就跳转了，也不能提交数据。如下图扫码枪录入数据后可以看到路由后面拼接了问号，想要调转路由。我和我的小伙伴陷入了沉思。。。...原创 2020-11-03 15:06:40 · 1643 阅读 · 0 评论 -
Vue3.0响应式原理
周日（2020-07-12）下了一天雨，闲来无事，就把vue的响应式原理从2.0-3.0手敲了一遍。从上篇博客中我们知道vue3.0在数据的响应式上无疑做了很大的优化，性能得到大大提升。虽然vue3.0还没有正式发布，但是各大公众号已经闹得不亦说乎。我们都知道vue2的响应式原理的实现依赖的是Object.defineProperty这个API,用它来为要实现响应式的数据设置getter和setter方法。如果数据多时就要循环遍历。循环遍历就会降低性能，所以vue3.0就摒弃了这个方法，改为使用ES6中原创 2020-07-13 20:51:42 · 307 阅读 · 1 评论 -
Vue2.0响应式原理
最近vue3.0响应式原理引起前端阵阵狂热，所以我也下定决心将vue的响应式原理总结一下。我们都知道vue2.0的响应式原理使用的一个核心API是Object.defineProperty.为我们要观察的数据设置getter和setter方法。1.响应式数据只有一个的时候，我们可以这样实现<!DOCTYPE html><html><head> <meta charset="UTF-8"> <title>vue2.原创 2020-07-13 20:23:28 · 565 阅读 · 1 评论 -
那些年使用vue-pdf踩过的坑
最近在vue项目中需要在线预览word,excel,ppt和pdf文件，思来想去最后决定使用vue-pdf来实现pdf文件在原页面中弹窗显示，而其他格式的文件直接跳转新页面预览。效果图1.首先在项目中安装vue-pdfnpm install vue-pdf --save2.在页面引入element-ui的弹窗组件（.vue）<el-dialog title="...原创 2019-11-07 18:59:46 · 10111 阅读 · 11 评论 -
Unexpected end of JSON input while parsing near '...0000274":{"name":"can'
在Vue中使用git管理项目的时候，经常会遇到Unexpected end of JSON input while parsing near '...0000274":{"name":"can'的错误，现将我的解决办法写出来1.清除之前的缓存信息npm cache clean --force2.重新安装模块npm install项目可以正常运行了。...原创 2019-04-02 08:39:30 · 1132 阅读 · 0 评论 -
vue实现组件化的三种形式
1.在script标签中注册组件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.原创 2019-03-11 19:14:39 · 960 阅读 · 0 评论 -
Vue组件通讯之子传父
子传父的通讯方式的实现是通过订阅者模式来实现的<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-s原创 2019-03-15 17:26:52 · 224 阅读 · 0 评论 -
Vue组件通讯之父传子
组件是Vue中的重头戏，今天开始我会陆续分享自己在学习中的有关组件通讯的一些心得。父组件传值子组件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="w原创 2019-03-15 17:00:14 · 256 阅读 · 0 评论 -
Vue实现双向数据绑定的新姿势
在Vue中实现数据绑定还是相当灵活的，可以通过属性和指令两种方式来实现先来看看第一种方式使用ref属性来来实现双向数据绑定<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>双向数据绑定</title> <script原创 2018-09-12 20:37:02 · 295 阅读 · 0 评论