- 博客(52)
- 收藏
- 关注
RSS订阅原创 vue的vue.config.js中反向代理pathRewite的理解
三，如果目标服务器是/users路径，是不是需要在pathRewrite中把/api设置为空？
2024-08-27 12:04:49
1375
1
原创 Vue页面通过Iframe嵌入别人页面并通过postmessage传递数据
接到一个新需求，自己的管理端不做登录，将页面嵌入别人的页面，直接在localstorage获取别人登录成功后存储到本地的用户信息，然后将其作为入参传入己方接口来获取自己所需的数据，但是这里会有一个问题就是。这样在自己的域内的localstorage也会有所需的数据了。
2023-12-14 11:22:30
660
原创 el-date-picker组件首次展开默认显示当上一个月和本月
elementUI的el-date-picker组件的下拉框默认显示的是本月至下月要修改为默认显示上月至本月
2022-08-11 10:47:14
5163
原创 Vue3中使用Vuedraggable拖拽
二 、使用三、Api原文地址：Vue3中简单使用vuedraggable拖拽_冷太阳a的博客-优快云博客_vue3 拖拽感谢原文作者分享文档地址：vue.draggable一款基于vue的拖拽插件 - itxst.com
2022-07-13 11:08:17
4883
1
原创 Vue3监听ElementUI的table的滚动事件
onMounted(() => { console.log( priceTable.value.layout.table, "priceTable.value.bodyWrapper" ); let table = priceTable.value.layout.table.refs.bodyWrapper; table.addEventListener( "scroll", () =&g.
2022-03-02 16:34:52
3005
2
原创 前端学习文档
vant :Vant 3 - Mobile UI Components built on Vueecharts：www.makeapie.comd2-admin ：https://d2.pub/zh/doc/d2-admin/component/container.html#%E5%8F%82%E6%95%B0threeJs:three.js-master下载_CDN_郭隆邦技术博客vue-cli安装three.js扩展控件orbitControls.js - 简书Three
2022-02-25 17:21:24
362
原创 Vue3项目中的路由配置
import { RouteRecordRaw, createRouter, createWebHistory, useRoute, // @ts-ignore} from "vue-router"// @ts-ignoreimport util from "/@libs/util"// @ts-ignoreimport store from "/@store/index"import Layout from "../layout/index.vue"// 进度条// .
2022-01-14 10:43:15
1127
原创 Vue3中JS控制Element-UI的el-tree点亮节点
父组件中的html：<template> //父组件 <div class="content"> //子组件 <member-tree ref="LeftMemberTree" /> </div></template>父组件中的调取接口获取的id赋值给子组件： LeftMemberTree.value.currentLayerDeptId = res..
2021-12-01 14:48:54
1127
原创 Vue3的Env环境变量配置的应用
.env（# 所有环境默认）# 所有环境默认# 页面 title 前缀VUE_APP_TITLE=某某某# 网络请求公用地址VUE_APP_API= /.env.development（# 开发环境）# 开发环境# 指定构建模式VITE_NODE_ENV=development# 页面 title 前缀VUE_APP_TITLE=图菱# 网络请求公用地址VITE_APP_API=/api/# 首页是否显示登录VITE_SHOW_LOGIN='yes'
2021-11-26 18:13:58
1834
1
原创 Echarts 相同页面、相同组件、显示不同数据
场景如图，相同页面内显示一个组件 想要显示不同的数据而不冲突 以下操作即可解决（用到math方法的随机数来给组件不同的id名）子组件内： <div class="charts-members-resources-content"> <div class="charts-members-resources" :id="chartsMembersResources" :style="{ width: '100%', height: .
2021-11-23 15:26:37
1396
1
原创 前端 图片无缝无限循环展示效果（animation）
主要是使用了CSS3的animation动画，可用于制作瀑布流，轮播等html：<div class="screen screen1"> <div class="screen-content1" v-if="urlList.length"> <el-image v-for="i in urlList[0]" :key="i" style=" width: .
2021-11-01 17:07:03
1737
原创 Echarts 隐藏series 其中的某条数据
这种场景通常用于想在toolTip显示某类数据 但是又不想让图标里显示线条series: [{ name: '...', type: 'line', symbolSize: 0, // symbol的大小设置为0让线的小圆点不显示 showSymbol: false, // 不显示symbol不显示 lineStyle: { width: 0, // 线宽是0不显示线 color: 'rgba(0, 0, 0, 0)' // 线.
2021-11-01 16:43:29
9019
1
原创 echarts5.x与vue3.x的一些问题
使用"axis" 正常情况下 是可以显示toolTip的：tooltip: { show: true, trigger: "axis", },效果如下：但是写死数据是可以显示toolTip的，调取接口过后则无法显示（嗯？？？？？？？？？？？？？）原因：Vue3中采用了Proxy对象代理，而Echarts中使用了大量的"==="造成对比失败解决方案:①将Proxy对象进行拆箱// proxy拆箱 解决...
2021-10-30 17:54:47
623
原创 适用于前端开发的工具函数
一.格式化年月日 传法：tool.parseTime(newDate(),"{y}-{m}"),// 日期格式化tool.parseTime = function (time, pattern) { if (arguments.length === 0 || !time) { return null } const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}' let date if (typ...
2021-09-09 16:27:43
458
原创 响应式随笔
本文为搬运学习 原文地址：https://blog.youkuaiyun.com/wangningjing87/article/details/103716934width: calc(100% - 20px);css3 的 calc()函数。这里的意思是设置宽度比100%的宽度少20px。calc()函数用于动态计算长度值。 calc()函数支持 "+", "-", "*", "/" 运算；calc()函数使用标准的数学运算优先级规则；...
2021-08-19 18:21:48
129
原创 Vue3父子传值
父传子父组件：<PosterDataDialog :currentPopOverUserName="currentPopOverUserName" :currentUid="currentUid" :dateValue="dateValue" ref="PosterDataDialog"/>let state = reactive({currentUid:xxx,dateValue:xxx,currentPopOverUserName:xxx})
2021-08-19 14:05:37
308
原创 对象数组中根据属性值大小排序Sort(时间戳之类)
posterDetail(){let timeLineList = [{color: "#0bbd87",createTime: "2021-08-13 21:11:38",designId: "63d0e8bb-7c2f-4bf9-975d-91a59c1cd5d7",id: 18,imgUrls: "",partner: "ckt",state: 1,timeStamp: 1610962434000,unPassCase: "",verifyTime: "2021-01-18 1.
2021-08-14 18:22:06
526
原创 Vue3中使用子组件触发父组件中的函数
父组件代码部分<template> <div class="home"> <edit-user ref="edit" @onEditUserSubmit="methods.getUserList" /> </div></template><script>import editUser from "./components/edit-user.vue";export default defineComponent
2021-08-13 14:29:50
362
转载 动态添加的路由 Vue3动态添加路由及生成菜单
本文为搬运学习，原文地址:https://blog.youkuaiyun.com/weixin_42510962/article/details/112618116?utm_term=vue3%E5%8A%A8%E6%80%81%E6%B7%BB%E5%8A%A0%E8%B7%AF%E7%94%B1&utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2~all~sobaiduweb~default-0-112618116&spm=
2021-08-13 11:59:27
2446
转载 Vue 动态添加的路由页面刷新时失效的原因及解决方案
本文为搬运学习,感谢原文大佬，原文地址:https://www.jb51.net/article/206376.htmVue2问题描述昨天在做vue后台管理系统有关权限页面动态添加到路由的功能时，遇到一个问题：动态添加的路由页面，在页面刷新时出现了404的情况。场景后台管理系统的权限控制是通过在前端页面定义权限code， 把code给后台同学保存配置到表中，之后根据后台返回的权限code列表与前端页面配置的code菜单列表做筛选匹配，code相等的页面就是有权限的页面，再通过rout
2021-08-13 11:50:48
4821
原创 CSS object-fit 属性的使用
对图片进行剪切，保留原始比例：img.a { width: 200px; height: 400px; object-fit: cover; }语法object-fit: fill|contain|cover|scale-down|none|initial|inherit;属性值值 描述 fill 默认，不保证保持原有的比例，内容拉伸填充整个内容容器。 contain 保持原有尺寸比例。内容被缩放。 cover 保持原.
2021-08-13 11:42:20
160
原创 CSS的font颜色渐变
HTML<span class="valueStyle">15</span>CSS.valueStyle{ font-weight:600; font-size:25px; margin-bottom:0px; cursor:pointer; background-image:-webkit-linear-gradient(bottom,red,#ff5f60,#f0c41b); -webkit-background
2021-08-13 11:36:07
335
转载 CSS好看的HOVER效果
本文为搬运学习,感谢原文大佬，原文地址:https://juejin.cn/post/6861501624993447950一.发送效果HTML<div id="send-btn"> <button> // 这里是一个svg的占位 Send </button></div>复制代码CSS#send-btn{ display: flex; align-items: center; justify-co
2021-08-13 11:31:49
438
原创 flex响应式布局
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>D.
2021-08-13 10:31:46
153
原创 Echarts自适应屏幕大小
目前我知道的两种方式//方式1window.onresize = function () { //自适应大小 charts1.resize() charts2.resize() charts3.resize()}//方式2<body onresize="myFunction()"></body>
2021-08-12 17:13:07
162
原创 Vue3 elementUI修改el-date-picker默认时间
HTML:<el-date-picker v-model="dateValue" type="daterange" size="small" unlink-panels range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" :shortcuts="shortcuts"></el-date-picker>JS://放在页面的state中.
2021-08-12 14:43:39
3097
2
原创 Vue3中vite动态import引入打包报错解决
import { RouteRecordRaw, createRouter, createWebHistory, useRoute,} from "vue-router"// @ts-ignoreimport util from "/@libs/util"// import Layout from '/@views/layout/Layout.vue'// @ts-ignoreimport store from "/@store/index"import Layout fro.
2021-08-11 12:06:56
19561
5
转载 微信小程序与font-awesome图标库
本文为搬运学习,感谢原文大佬，原文地址:https://zhuanlan.zhihu.com/p/165568293第一步：去官网下载font-awesome字体包font-awesome官网下载完是一个压缩包，解压之后是这个亚子第二步：找到红线圈出的ttf文件，并上传到这个网址操作如下第三步：convert下载完成之后是一个压缩包，解压之后是这个亚子找到stylesheet.css文件并打开我双击之后默认是hbuilder打开的，无所...
2021-08-10 16:16:34
393
转载 微信小程序HTTP接口请求封装
本文为搬运学习,感谢原文大佬，原文地址:https://www.cnblogs.com/wuliujun521/p/11458379.html1.方法封装（新建文件夹util，工具文件，在文件夹下创建request.js文件，用于对方法封装）request.js：var app = getApp();//项目URL相同部分，减轻代码量，同时方便项目迁移//这里因为我是本地调试，所以host不规范，实际上应该是你备案的域名信息var host = 'http://localhost:8081
2021-08-10 16:09:29
339
转载 微信小程序 wx.navigateTo()传参方法
本文为搬运学习,感谢原文大佬，原文地址:https://blog.youkuaiyun.com/weixin_43970434/article/details/98876750参数传递1.数据需要转义为字符串才能通过参数传递 JSON.stringify()2.多个参数传递，前面要加 & 符号let dataList = JSON.stringify(this.data.dataLists)wx.navigateTo({ url: '../details/details?dataList=
2021-08-10 16:04:46
11981
转载 原生js 滚动到底部的时候触发的事件
本文为搬运学习,感谢原文大佬，原文地址:https://blog.youkuaiyun.com/qq_34507902/article/details/102545270代码入下:<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"&.
2021-08-10 16:01:19
1270
转载 时间段选取
本文为搬运学习,感谢原文大佬，原文地址:https://www.cnblogs.com/lvxisha/p/10673522.html时间段开始时间小于结束时间的判断，下面是封装号的方法，直接可以调用：var data = new Date(); var year = data .getFullYear(); //获取完整的年份(4位) var month = data .getMonth(); //获取当前月份(0-11,0代表1月) console.log("时间：："+f
2021-08-10 15:58:26
225
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人