- 博客(24)
- 收藏
- 关注
RSS订阅原创 vr全景krpano + vue3
krpano + vue31. 引入 1.1 index.html中引入 tour.js //static 存放krpano生成的vtour文件<script src="./static/vtour/tour.js"></script> 1.2 页面中创建pano 输出节点<div id="pano"></div> 1.3 在mounted中初始化节点onMounted(() => { embedpano({ sw
2022-03-24 16:47:34
1735
原创 js 树结构根据当前选中节点 获取对应整条链结构数组列表
js 树结构根据当前选中节点 获取对应整条链结构数组列表function treeFindPath(tree, func, path = []) { if (!tree) return [] for (const data of tree) { path.push(data) if (func(data)) return path if (data.children) {
2022-03-24 16:44:28
424
原创 图片超宽高 等比例缩小函数
图片超宽高 等比例缩小 calcImageShowSize(width, height) { let showMaxWidth = 800 let showMaxHeight = 1000 let showWidth = Math.min(width, showMaxWidth) let showHeight = (height / width) * showWidth if (showHeight > showMaxH
2021-11-17 10:40:56
123
原创 vue3 通过ref 获取v-for循环出来的dom节点
//template :ref="(el) => (img[index] = el)"//setupconstr img = ref([])return {img}
2021-10-13 19:06:05
1168
原创 element el-select可选择可输入
<el-select v-model="saveWardForm.wardCode" placeholder="" filterable @blur="selectBlur" > <el-option v-for="(item, index) in virtualWardData" .
2021-08-23 18:10:36
857
原创 vue 实现拖拽市 列表
vue 实现拖拽市 列表js原生拖动事件:在拖动目标上触发事件 (源元素):ondragstart - 用户开始拖动元素时触发ondrag - 元素正在拖动时触发ondragend - 用户完成元素拖动后触发释放目标时触发的事件:ondragenter - 当被鼠标拖动的对象进入其容器范围内时触发此事件ondragover - 当某被拖动的对象在另一对象容器范围内拖动时触发此事件ondragleave - 当被鼠标拖动的对象离开其容器范围内时触发此事件ondrop - 在一个拖动过程中，
2021-08-19 14:44:54
273
原创 VUE3使用echarts 生产环境跳转路由后不显示
VUE3使用echarts 生产环境跳转路由后不显示1.vue3使用echarts 写法 : 使用动态id 防止跳转路由后不显示 <div :id="ChartLeft"></div>const Chart = ref("Chart" + Date.now() + Math.random()) //记得return Chartlet myChart = echarts.init(document.getElementById(Chart.value)) Chart.s
2021-08-17 11:25:42
967
2
原创 vite 使用import.meta.glob动态添加vue页面
使用vite的 GlobImport 动态导入多个vue页面在使用vite实现后台管理系统的时候，有个需求是动态导入views文件夹下面的所有页面，在vite1.0版本的时候只能手动写映射关系，升级到vite2.0之后，在本地使用没有问题，打包上生产直接裂开~~，vite提供了一个Glob Import方法。如果直接使用import.meta.glob，vscode会报类型ImportMeta上不存在属性“glob”的错误，需要在tsconfig文件下添加类型定义vite/client{ "com
2021-08-11 10:59:33
22019
7
原创 vue3+vue-router4.0 动态路由 add-Route
vue3+vue-router4.0 动态路由 add-Route用Vue3就必须用Router4.x版本，由于4.0去掉了addRoutes 所以只能用addRoute现在是只能添加一个function routerPackag(routers:any) { if (routers) { routers.filter((itemRouter:any) => { if (itemRouter.component != "Layout") { router.
2021-08-09 14:55:35
4455
2
原创 vue3浏览器后退前进不刷新页面 keep-alive中使用问题
一、业务场景示例页面A: 数据列表，有一些查询条件，如查询条件区域，查询结果为区域信息列表页面B: 数据详情，点击列表任意一条记录，跳转到对应的区域详情期望：在页面B，点击浏览器返回按钮，显示上一次页面A查询结果与查询条件（最好不重新请求）二、实现利用vue的keep-alive，使用keep-alive可以是组件在第一次创建时被缓存下来，离开页面时不销毁使用了keep-alive生命周期1.activated：页面第一次进入的时候，钩子触发的顺序是created->mounted-&
2021-07-27 15:35:42
1909
1
原创 组件通信笔记
1.组件通信组件之间相互传递数据1.1 父传子(如果在A组件中使用了B组件，那么A组件就是父组件，B组件就是子组件)父组件传数据给子组件通过属性来传递<template> <div> <子组件 属性名1="属性值1" 属性名2="属性值2"></子组件> </div> </template>子组件通过props接收父组件传的数据 export default { p
2021-07-21 15:59:13
52
原创 vue+element 按钮Loading统一处理
vue 按钮Loading处理1.按钮的loading效果可以处理后台响应时间有点长场景，这里使用store封装了下处理方式// loading.jsimport Vue from 'vue';const loading = { state: {}, mutations: { SET_LOADING: (state, data) => { const isObject = Object.prototype.toString.call(data)
2021-07-21 15:55:41
2785
1
原创 前端适配解决方案
1.px 换成 -> rem2.将media.js 引入html （你可以修改1200 -> 1920）3.不建议字体弹性字体出现精度有可能会无效。浏览器只支持到12px。展示层面会异常，盒模型变化时，字体被限缩放到14px无法被继续缩小。// media.js ; (function (doc, win) { var docEl = doc.documentElement var resizeEvt = 'orientationchange' in window ? '
2021-07-21 10:00:28
179
1
原创 vue3 element-table自定义表头和内容
使用vue3 element plus中el-table表头数据与内容数据分开表头数据表格数据关键代码//根据列id对应表头id 显示数据<el-table :data="pagination" style="width: 100%"> <template v-for="(col, index) in hearder" :key="index"> <el-table-column :label="col.colTitle" align
2021-07-17 16:12:19
1492
原创 js时间戳转年月日
js 时间戳转日期格式// 转日期 getLocalTime(time) { var date = new Date(parseInt(time)) var year = date.getFullYear() var mon = date.getMonth() + 1 var day = date.getDate() return year + "/" + mon + "/" + day },...
2021-05-22 10:05:13
240
原创 js 烟花效果
**js 烟花效果 **<!DOCTYPE html><html><head lang="en"> <meta charset="UTF-8"> <title></title> <style> body { margin: 0; padding: 0; background-color: black; } </style></he
2021-05-13 10:13:33
228
原创 js删除数组中指定项
js删除数组中指定项let arr = [1,2,3]let s= 2arr.splice(arr.findIndex(v=>v===s),1)
2021-04-10 12:03:48
144
原创 vue按钮级权限控制
vue按钮级别权限控制设置权限信息1.在登陆后查询当前用户的权限集合const getInfo = await api.getInfo(); //roles:['admin‘,'edit']2.然后保存到localStorage里const setRoles = function(name, data) { localStorage.setItem(name, JSON.stringify(data));}; setRoles("permission", getIn
2021-03-31 17:09:31
327
原创 d2-admin-路由菜单
d2-admin 路由菜单记录路由格式如下expore const frameIn =[ { path: "index", name: "index", title: "首页", icon: "home", component: _import("system/index"), children:[ { path: "role", name: "role", title: "角色管理", icon
2021-03-31 17:07:24
2827
1
原创 vue之 -- 分页器封装
vue之 – 分页器封装使用组件<template> <pagination :total="listQuery.total" :page.sync="listQuery.pageNum" :limit.sync="listQuery.pageSize" @pagination="getList" /></template>import Pagination from "@/compo
2021-03-22 17:25:24
248
原创 Vue3.x开发文档
Vue3.x开发文档1 特点Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合易用已经知道HTML/CSS/JavaScript即可使用。灵活可以在一个库和一个完整框架之间自由使用。高效运行大小20KB,超快虚拟DOM,最省心的优化2 Vue3.x VS Vue2.x 主要改进2.1 提升运行时性能：
2021-03-22 10:06:14
609
全国省市区县JSON数据，带坐标
2023-07-13
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人