![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
后台
后台管理系统
小白白哦(๑•̀ㅂ•́)و
徐徐图之
展开
-
el-upload自定义http-request 上传方法踩坑
el-upload自定义上传的坑:http-request 指令的使用使用该指令, :on-success, :on-error 指令是不会触发的<el-form-item label="logo" prop="logo"> <el-upload class="upload-demo" ref="upload" action="string" accept="image/jpeg,imag转载 2021-06-07 16:20:37 · 8748 阅读 · 1 评论 -
el-date-picker设置时间不可修改,只能点击
<el-date-picker ref="article_time" @click.native="handle_setTime" popper-class="article_time" v-model="form.autoOnShelfDate" value-format="yyyy-MM-dd HH" type="datetime" placeholder="原创 2021-05-31 14:54:04 · 1552 阅读 · 0 评论 -
element ui 中 table 排序 sortable失效问题
sortable效果:(不生效)<el-table-column label="位置" sortable align="center" width="180"> <template slot-scope="scope"> <span style="margin-left: 10px">首页顶部banner{{ scope.row.priority }}号位</span> </templa原创 2021-04-02 09:26:24 · 997 阅读 · 0 评论 -
element表格行列拖拽
element ui 表格没有自带的拖拽排序的功能,只能借助第三方插件Sortablejs来实现,先来看一下动态图,效果是不是你们想要的。首先需要安装Sortable.jsnpm install sortablejs --save然后引用import Sortable from ‘sortablejs’需要注意的是element table务必指定row-key,row-key必须是唯一的,如ID,不然会出现排序不对的情况。示例代码 <el-table :data="tabl转载 2021-05-26 13:33:07 · 244 阅读 · 0 评论 -
el-date-picker饿了么时间组件限制三个月
<el-date-picker v-model="time" value-format="yyyy-MM-dd" type="date" placeholder="选择日期" :picker-options="pickerOptions" /> data() { return { // 禁用的时间 pickerOptions: { ..原创 2021-04-27 19:30:10 · 1356 阅读 · 0 评论 -
百度编辑器Ueditor:报错`UE.getEditor is not a function`和`editor.all.js找不到`
UE.getEditor is not a function和editor.all.js找不到有看这篇文章说安装grunt,然后执行grunt default但是我这边跑完grunt default弹出然后安装了JDK接着重跑然后又出来下面截图问题:Warning: Error: Unable to access jarfile undefined Use --force to continue.Aborted due to warnings.总觉得不太对,然后继续百度,找到了解决办.转载 2021-04-19 14:34:02 · 1597 阅读 · 3 评论 -
Vue+Element UI 向Table组建中的每一行添加一个switch组件,实现每一行单独控制及其踩坑
<el-table :border="true" :data="tableData" style="width: 500px;margin:0 auto;"> <el-table-column label="视频开关"> <template slot-scope="scope"> <el-switch active-text=..原创 2021-04-21 23:14:21 · 836 阅读 · 0 评论 -
滚动条不显示但是可以滚动
<style lang='scss' scoped>//新建弹窗尺寸.el-drawer__wrapper ::v-deep.demo-drawer{ width: calc(100vw - 211px)!important; overflow: scroll ;}::v-deep .dialogPreMockVisible .el-dialog__body .container::-webkit-scrollbar {display:none}<style>...原创 2021-03-19 15:54:43 · 260 阅读 · 0 评论 -
v-loading.fullscreen.lock
解意fullscreen:全屏lock:锁定实现效果当加载时全屏幕锁定,不可触发任何事件、即使在有滚动条的情况下滚动事件同样禁止转载 2021-03-21 23:04:58 · 2667 阅读 · 0 评论 -
实现给后端返回的数据排序
var data = { "rows": [{ "name": "张三", "time": "2011/4/1 0:00:00", },{ "name": "李四", "time": "2015/5/6 12:30:00", },{ "name": "王五", "time": "2012/10/1 22:10:00", },{ "name": "赵六", .转载 2021-03-23 15:18:10 · 1242 阅读 · 0 评论 -
vue 项目中使用video实现视频播放效果暂停播放
<video :src="video_url" controls="controls" style="width:100%;height:100%;" ref="vueMiniPlayer"></video>再给this.video_url='http://47.105.206.28/videos/wangkun.mp4'判断是否暂停状态返回true falsethis.$refs.vueMiniPlayer.pause();//暂停this.$refs.vueMi.转载 2021-04-11 20:49:47 · 2364 阅读 · 0 评论 -
vue-quill-editor的样式问题
编辑好文章之后再展示出来发现之前编辑的样式并没有生效,这个时候需要在渲染内容的盒子里面添加类名才会生效<div class="ql-container ql-snow"> <div class="ql-editor" v-html="list.content"></div>而且需要保证有引入css的样式在main.js或者是在其他组件js中然后引到main.js或者在页面里引入import 'quill/dist/quill.snow.css'原创 2021-03-31 18:36:42 · 480 阅读 · 0 评论 -
vue-elementUI的select下拉多选组件实现:可搜索+弹窗显示全部功能
多选点击数字弹窗<template> <div class="box"> <span v-if="value.length>0" class="heiz" @click="dialogVisible=true"></span> <el-dialog title="提示" :visible.sync="dialogVisible" width="30%" :before-close="handleClose"原创 2021-03-17 23:04:28 · 2140 阅读 · 0 评论 -
使用vue-quill-editor编辑器--自定义上传图片-图片拖拽-鼠标悬停提示
quill的官网在vue里面使用quill的扩展模块vue-quill-editor效果图:实现:1.鼠标悬停时的提示,2.因为编辑器默认图片是base64格式,所以需要自定义上传图片到服务器,通过服务器给的ID返回给后端,后端再给出URL然后前端插入在编辑器中3.图片的拖拽和缩放1、下载Vue-Quill-Editornpm install vue-quill-editor --save2、下载quill(Vue-Quill-Editor需要依赖)npm install quill原创 2021-03-31 19:13:24 · 1052 阅读 · 2 评论 -
vue中引入.svg图标,使用iconfont图标库
阿里巴巴的iconfont是一个很好的图标库,海量的素材可以快速满足开发人员日常对图标的诉求,我们采用symbol引用,官方介绍创建SvgIcon组件–components =>SvgIcon=>index.vue<template> <svg :class="svgClass" aria-hidden="true"> <use :xlink:href="iconName"></use> </svg></t转载 2021-03-21 10:57:58 · 422 阅读 · 0 评论 -
Vue.js使用Blob的方式实现excel表格的下载(流文件下载)
<el-button @click="handlerExportData">导出</el-button> // 导出 handlerExportData(){ getReportAllData({queryDate:this.time}).then(res=>{ this.$Utils.exportExcel(res) }) }, /** * 导出excel文档 */ exportExce原创 2021-07-19 10:34:57 · 440 阅读 · 0 评论