目录自定义input组件实现拖拽文件上传vue部分逻辑部分删除当前文件封装的tag-input组件最后实现的效果多图上传组件vue组件template部分组件script部分组件使用组件完整代码(含裁剪组件,不需要请手动删除)效果展示总结自定义input组件实现拖拽文件上传vue部分<tag-input id="uploadTag" ref=" ......
223
0
0
2023-09-10
目录computedComputedRefImpl小结:watchcomputedcomputed和watch在面试中经常被问到他们的区别,那么我们就从源码的实现来看看他们的具体实现// packages/reactivity/src/computed.ts export function computed<T>( getterOrOpt ......
194
0
0
2023-09-09
最近做vue项目遇到一个需求,就是前端实现上传word或pdf文件后,后端返回文件对应的文件流,前端需要在页面上展示出来。word预览简单一些,pdf预览我试过pdfjs,vue-pdf总是报各种奇奇怪怪的bug,但最终总算解决了问题,先看一下页面最终呈现效果吧:页面上传pdf文件效果如下:页面预览pdf文件效果如下:页面上传word文件效果如下:页面预览w ......
631
0
0
2023-09-09
目录效果图:(移动上去也会有效果的那种哦)第一步:vue中安装echarts和echarts-gl第二步:在vue文件中引入第三步:实现具体代码(完整的)第四:我想说一下注意事项哈总结 效果图:(移动上去也会有效果的那种哦)第一步:vue中安装echarts和echarts-glnpm install echarts npm install ec ......
267
0
0
2023-09-06
目录前言一、什么是模板语法?二、内容渲染指令1. v-text2. {{ }} 插值表达式3. v-html三、双向绑定指令1. v-model2. v-model的修饰符四、属性绑定指令1. 动态绑定多个属性值2. 绑定class和style属性五、条件渲染指令1. v-if、v-else-if、v-else2. v-show3. v-if和v-show的 ......
215
0
0
2023-08-24
目录组件间传值的两个坑实例填坑坑一1. 发现天坑2. 填坑时刻坑2:1.发现天坑2.填坑时刻总结组件间传值的两个坑我们都知道父组件可以把值传递到自组件中,但是有时候子组件需要修改这个父组件传递过来的这个值,我们可以想象下能修改成功吗?这是坑之一。我们在组件间传值的时候,都是一个属性名对应一个值,接收的时候也是用这个属性名接收,那么每一个用户自定义的属性名都能 ......
217
0
0
2023-08-24
目录 一、表单效验规则的使用1、自定义效验规则介绍2、绑定效验方法3、添加效验4、效验判断5、清除效验规则二、常见表单效验规则(一)pattern验证(二)validator.js文件中常见的验证方法 一、表单效验规则的使用1、自定义效验规则介绍是否必填: required: true || fasle效验消息提示:m ......
311
0
0
2023-08-14
目录什么是三次握手?什么是四次挥手?(close触发)什么是VUEX?什么是同源----跨域?什么是Promise?什么是fexl布局?数据类型什么是深浅拷贝?什么是懒加载?什么是守卫?DOMVue2与Vue3的区别Vue中data为什么是函数?Vue根实例为什么没有这个限制?Vue设计原理Web时代的演变    &n ......
164
0
0
2023-08-13
目录前言vue-element-admin 官方实现的方式参考文档:webpack-theme-color-replacer 插件的实现方式总结前言最近基于 ElementUI 的项目上需要实现动态换肤的功能,这里提供两种方式:vue-element-admin 官方实现的方式webpack-theme-color-replacer 插件 ......
284
0
0
2023-08-07
目录前言一、过滤路由二、搜索框展示路由三、雏形出现但有缺陷四、优化搜索方式五、完整代码展示结论前言本篇文章分享一下我在实际开发 Vue 项目时遇到的需要 —— 全局菜单搜索。全局菜单搜索本质是 router 的使用,该功能已经实现,接下来分享一下开发心得。一、过滤路由首先需要过滤出符合条件的路由信息,过滤的条件包含两个:路由可以显示出现(hidden: fa ......
244
0
0
2023-08-05
目录简单diff算法更新文本节点key的作用如何移动呢双端diff算法比较方式非理想情况的处理方式今天又重读了vue2的核心源码,主要之前读vue2源码的时候纯属的硬记,或者说纯粹的为了应付面试,导致我们并没有去细品源码中的精妙之处。如果回头在重读源码的时候,发现其中有很多地方是值得我们深入了解的。比如我们今天要看的“双端diff”。还记得之前就记得双端di ......
249
0
0
2023-08-04
目录引言1、引用百度地图2、在项目中使用百度地图2-1、页面结构部分2-2、js逻辑部分3、在项目中使用百度地图辅助工具BMapGLLib3-1、页面结构部分3-2、js逻辑部分4、在项目中使用BMap实例引言记录一下vue项目使用百度地图所用的api和踩过的坑,减少以后引用少走弯路。旨在记录,第一次开贴,不足之处请多多指教。废话不多说,开撸!1、引用百度地 ......
233
0
0
2023-07-31
很多地方都要用到日历控件,比如生日、出发到达日期等等,本文就来介绍一下vue3日历控件的具体实现,具体如下效果如下:<template> <div class="cal_con" style="margin-left:px"> <div class="cal_header"> <!-- ......
180
0
0
2023-07-30
目录一、需求描述二、界面展示三、代码实现一、需求描述前段时间接到一个需求是做一个类似接口文档的显示功能,将一段json数据贴到里面就可以自动解析出json数据的每个字段的类型和层级关系,用element组件的树表格的形式展示,并且可以手动新增、修改和删除某个数据字段。二、界面展示功能如下图所示:1.未贴数据之前:2.点击右上角的‘导入json',在打开的弹框 ......
240
0
0
2023-07-29
目录VUE简单使用lodop1.创建LodopFuncs.js文件2.在打印功能vue页面引入LodopFuncs3.执行打印方法4.打印接口函数官网样例说明5.完整页面示例VUE 集成LODOP插件打印Lodop、C-Lodop使用说明及样例http://www.lodop.net/LodopDemo.htmlVUE简单使用lodop1.创建LodopFu ......
295
0
0
2023-07-28