前言因为老大突然说网站后台负责维护的人员上传到富文本(为了SEO就不用贴图)的内容,一些图片显示失败,我一看还真是之前好不容易弄好这个富文本的图片上传功能(就是点击图片,选择上传)还真没有想到他们直接扒过来别的网站内容(尤其里面包含图片)这时候加入这个网站设置跨域,图片就会因为跨域显示403失败,无法加载出来.吐槽:还以为他们富文本把文字写好,在一个个上传图片,组成一片文章.那就没有办法了,只能修改下代码增加下自动上传图片功能.后来写到一半才发现html有个属性好像可以让跨域的图片显示出来.暂时不太理解这个代码,也不清楚有没有副作用,希望有懂的大佬说下.以为这样就可以不用写了,但是老大说万一以
文章目录一、element-ui/mint-ui组件库1.1element-ui使用步骤1.1.1引入组件1.1.2修改.babelrc文件1.2mint-ui的使用1.2.1安装引入组件1.2.2Mint-ui相关组件一、element-ui/mint-ui组件库element-ui提供了大量的组件，如：布局组件、表单组件、JS组件等等。1.1element-ui使用步骤Element-ui官网：https://element.eleme.cn/#/zh-CN安装Element-ui：npmielement-ui-S1.1.1引入组件引入Element完整引入(在main.js中写入以下内容
后台管理系统是我们许多信息化项目必不可少的子系统。使用Vue作为后台管理系统或者业务系统的前端框架，开发起来非常便利，因为Vue是前端三大主流框架之一，也是目前最火的一个前端框架，拥有强大的社区支持。Vue作为一套构建用户界面的框架，关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合，能够提高开发效率。目前Vue的3.0版本比2.0有了许多提升，这也是本文分享基于Vue3的后台管理项目的原因。Vue3主要提升的地方包括：响应式性能提升：性能比Vue2快1.2～2倍。代码体积更小：相比Vue2，Vue3按需编译，整体体积变小了。支持组合API（CompositionApi）：Vue2使用
文章目录前言一、申请阿里云OSS二、Vue前端读取图片三、将图片base64转成二进制文件四、搭建express服务器五、通过axios给服务器发送请求六、发送图片并上传阿里云我们首先了解一下，要怎么发送图片给服务器我们把最终效果留到最后一起看，我们先看一下服务器那边的代码是什么样的总结前言上篇文章提到了如何用mock.js来模拟接口，方便在后端没有写好接口的时候也能顺利开发，本来计划这篇文章是讲一下用轮播图组件swiper来展示一下模拟接收到的数据和图片，但项目计划发生了变化，这个就推到后面再说。mock模拟接口虽然很好用，但是在项目开发的时候还是要有一个真的服务器会比较好，比如我最近要实现
本文基于vue-cli5.0.0,webpack5.0,TerserWebpackPlugin最近公司项目开发上线后，发现控制台有很多当时测试时打印的信息。但是如果手动删除然后打包的话工作量太大，而且不利于以后的维护和debugger。所有必须通过webpack打包时自动帮我们删除console和注释。第一步上网找到webpack关于优化console.log语句的插件---------uglifyjs-webpack-plugin，但是查看npm库后发现这个库很久没更新过怀疑可能不适配webpack5 最后在webpack官网找到这个插件TerserWebpackPlugin 接下来就是下载
代码实现了一个基本的滑动功能，通过鼠标按下、鼠标松开和鼠标移动事件来监听滑动操作。具体实现逻辑如下：在 onMounted 钩子函数中，我们为滚动容器添加了三个事件监听器：mousedown 事件：当鼠标按下时，设置 control.isDown 为 true，记录鼠标起始位置 control.startX 和滚动条位置 control.scrollLeft。mouseup 事件：当鼠标松开时，设置 control.isDown 为 false，表示鼠标已经抬起。mousemove 事件：当鼠标移动时，如果 control.isDown 为 true，则计算鼠标的滑动距离 walk，并将滚动容
Axios网络请求Axios这是一个基于promise的网络请求库，作用于node.js和浏览器中在实际开发中，前端页面所需要的数据往往需要从服务器获取Axios在浏览器端使用XMLHttpRequest发送网络请求，并能够自动完成JSON数据的转换安装npminstallaxios文档https://axios-http.cn使用在main.js或者需要的组件中导入importAxiosfrom'axios'使用created:function可以在组件被创建时调用其中的方法，mounted：function函数是在组件被渲染到页面上时调用exportdefault{created:func
起因：由于需要在一个项目内接入多种常用的视频流，所以接触到video.js，这里就做个记录。框架：vue2+video.js+videojs-contrib-hls+videojs-flvjs-es6+videojs-flash+video-js.swfvue安装就不讲了，直接从项目开始了。第一步：安装依赖//video.jsnpminstallvideo.js//安装hls，用于播放HLSnpminstallvideojs-contrib-hls//安装flv，用于播放FLVnpminstallvideojs-flvjs-es6npminstallflv.js//安装flash用于播放RTM
前言：在前端项目中牵扯的最多的莫过于组件之间的传值了，除了最最常用的props和emit，其实在Vue中还额外提供了另外几种方法。今天分享一种组件之间通信的方法。一.场景再现先别着急考虑标题这个api的含义。在这里我先动手写一个比较常见的场景。所对应的组件内部代码比较简单，这里我就不展示了，逻辑上就是这三个组件层层引用。所对应的页面效果如下：如上图，这是一个在项目中很常见的一个场景，三层嵌套的组件。(其实还有深层次的嵌套，目前我们拿三层嵌套举例足矣)ok，你现在的需求是：在爷爷组件内需要提供一个字符串数据“韩振方”去提供给儿子组件使用。聪明的你肯定想到了props，废话不多说，我们直接上手。二
1.安装好nginx。2.把vue项目的源码克隆到确定目录下。用git管理，所以直接gitclone到既定目录就行了。如我的目录是：/root/jiangyu/projects/gentle_vue/gentle_vue_code。3.项目打包：npmrunbuild复制会自动生成dist文件夹。4.在任意目录下新建文件dockerfile。内容如下：#设置基础镜像FROMnginx#定义作者MAINTAINERjiangyu#将dist文件中的内容复制到/usr/share/nginx/html/这个目录下面COPYdist//usr/share/nginx/html/复制5.构建镜像：#-
