![](https://img-blog.csdnimg.cn/20201014180756738.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
Vue
废柴小z
这个作者很懒,什么都没留下…
展开
-
使用AlloyFinger插件实现div包括其子元素的双指缩放单指移动
【代码】使用AlloyFinger插件实现div包括其子元素的双指缩放单指移动。原创 2023-05-12 11:47:25 · 169 阅读 · 0 评论 -
webpack3升级到webpack4优化打包
6、替换extract-text-webpack-plugin为mini-css-extract-plugin ^0.5.0,下有详细说明。webpack4不支持extract-text-webpack-plugin,因此替换为mini-css-extract-plugin。1、extract-text-webpack-plugin替换成mini-css-extract-plugin。1、如果按照上述操作,升级之后,执行npm run dev,会碰到一个问题。二、跑通本地npm run dev。转载 2023-02-16 20:15:14 · 178 阅读 · 0 评论 -
vue基础配置
在config/index.js下。原创 2023-02-13 15:45:27 · 194 阅读 · 0 评论 -
vue加载gltf模型
【代码】vue加载gltf模型。原创 2022-11-04 11:24:39 · 1176 阅读 · 0 评论 -
vue实现生成二维码与扫描二维码
【代码】vue实现生成二维码与扫描二维码。原创 2022-10-10 12:17:57 · 852 阅读 · 0 评论 -
node升级到最新版本导致node-sass版本不兼容问题解决办法
注意:如果只卸载重装node-sass还将出现如下问题,所以一定要同时卸载重装node-sass和sass-loader。如果你已经遇到如下问题,解决办法也是卸载重装node-sass和sass-loader。解决办法:卸载重装node-sass和sass-loader。为防止npm被墙导致的相关问题,使用淘宝镜像。出现node-sass版本不兼容问题。node升级到最新版本。原创 2022-09-28 17:46:50 · 1557 阅读 · 0 评论 -
Vue轮播图
* { margin: 0; padding: 0;}ul li { list-style: none; float: left; width: 3rem; height: 4rem; line-height: 4rem; text-align: center; cursor: pointer; color: rgba(255,255,255,.8); font-size: 1.6rem;}.banner {原创 2022-03-14 20:45:40 · 1463 阅读 · 0 评论 -
控制图片缩放移动
鼠标滚轮缩放图片,双指移动缩放图片鼠标移动拖动图片,单指移动拖动图片Vue.component('imgControler', { props:{ imgsrc: String }, data: () => { return { isWin: isWin, imgscale: 3, imgLeft: 0, imgTop: 0,原创 2022-03-14 20:01:40 · 1847 阅读 · 0 评论 -
vue 打包部署后打开网页空白,找不到css、js等资源
修改config文件夹下的index.js文件build: { index: path.resolve(__dirname, '../dist/index.html'), assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', assetsPublicPath: './',//前面加上. productionSourceMap: true, ```修改build.转载 2021-03-11 11:03:01 · 1862 阅读 · 0 评论 -
vue实现自定义video的controller
html:<div ref='videoContainer' :class="['myvideo-box',fullScreenState ? 'fullscreen' : '']" @mousemove='controlerShowControl(true)' @mouseout='controlerShowControl(false)' @click='controlerShowControl(true)'> <video ref='vide原创 2020-09-02 17:22:39 · 2250 阅读 · 0 评论 -
关于Element-UI Upload 上传图片第二次或第N次无反应的问题
如果我们设置了 :limit=“1” ,在我们上传完成第一张图片后,如果想更改当前的图片那么很幸运的告诉你,不行、没效果。导致整个问题的原因是因为你没有清除当前 files,导致他一直保存这你第一次上传文件的信息,只要你把他一刀切掉就好了!那么问题来了,应该怎么清除呢!看下面的代码://只需要给你的el-upload 定义一个ref就可以<el-upload class="upload-demo" ref="upload"> <el-button size="small" t转载 2020-07-28 21:34:41 · 2739 阅读 · 1 评论 -
富文本编辑vue-quill-editor自定义图片、文件上传
原文:https://www.jianshu.com/p/9e4e4d955d0f需求一 图片上传就是要一个富文本编辑器,然后有图片上传功能,因为vue-quill-editor是将图片转为base64编码,所以当图片比较大时,提交后台时参数过长,导致提交失败。解决思路将图片先上传至服务器,再将图片链接插入到富文本中图片上传的话可以使用element或者iview,这里我以iview举例图片上传区域要隐藏,自定义vue-quill-editor的图片上传,点击图片上传时调用iview或者elem转载 2020-07-23 22:55:21 · 2439 阅读 · 3 评论 -
配置webpack的低级错误
今天自己配置webpack打包的时候遇到一个问题,我创建了webpack.config.js并写了一些配置,但是执行npm run build的时候打包是打包成功了,但我的webpack.config.js的里写的配置没有用,?????。我还查原因查找了好半天。最后发现我把webpack.config.js的名字写错了,写成了wepack.config.js。在此嘲笑一下智障的自己。并说明下:如果 webpack.config.js 存在,则 webpack 命令将默认选择使用它。不需要去packag原创 2020-05-26 14:10:37 · 224 阅读 · 0 评论 -
Vue原理解析与实现
MVVM框架介绍M(Model 模型层)V(View 视图层)VM(ViewModel 视图模型 V与M连接的桥梁)MVVM框架实现了双向数据绑定当M层数据进行修改时,VM层会检测到变化,并通知V层进行相应的修改修改V层时会通知M层数据进行修改MVVM框架实现了视图与模型层的项目解耦几种双向数据绑定的方式发布-订阅者模式(backbone.js)一般通过pub、sub的方式实现数据和视图的绑定,但是使用起来比较麻烦脏值检查(angular.js)angular.js是通过脏值原创 2020-05-17 08:56:27 · 318 阅读 · 0 评论 -
vue实现旋转木马(图片数量无限制)
<!DOCTYPE html><html><head> <title></title> <meta charset="UTF-8"> <meta http-equiv="Access-Control-Allow-Origin" content="*"> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"><原创 2020-05-15 11:39:22 · 1602 阅读 · 0 评论 -
vue知识点汇总
v-text v-html {{}} 响应式绑定htmlv-bind 响应式绑定元素特性v-on 监听DOM事件v-once v-if v-for 渲染结构props结合v-bind实现父子组件传值一个路由(url)对应一个html页面,路由反应html页面的相对路径,将组件 (components) 映射到路由 (routes),然后告诉 Vue Router 在哪里渲染它们co...原创 2019-12-03 17:33:39 · 179 阅读 · 0 评论