- 博客(85)
- 收藏
- 关注
RSS订阅原创 如何让input标签或者textarea标签宽高随内容自适应，且去掉 textarea右下角的样式
【代码】如何让input标签或者textarea标签宽高随内容自适应，且去掉 textarea右下角的样式。
2024-01-16 21:16:47
510
原创 重构项目 vue2 =＞ vue3 & nuxt2 =＞ nuxt3 遇到的问题
警告：Vue received a Component which was made a reactive object. This can lead to unnecessary performance overhead, and should be avoided by marking the component with。.使用"markRaw"方法将组件对象标记为非响应式对象，或者使用"shallowRef"代替"ref"来创建一个浅响应式对象。语法，需要使用Vue提供的。
2023-10-09 11:12:26
688
原创 报错Uncaught (in promise) Error: Manifest request to...
Uncaught (in promise) Error: Manifest request to...,解决方案：不要打开两个以上的开发者工具；更换nuxt的端口号
2023-08-09 22:00:00
397
原创 path.join()及path.resolve()区别
path.join只是简单的将路径片段进行拼接，并规范化生成一个路径，而path.resolve则一定会生成一个绝对路径，相当于执行cd操作，与cd操作不同的是，这些路径可以是文件，并且可不必实际存在。
2023-08-07 19:15:00
528
原创 qiankun 与vue-router4 不兼容导致路由显示 undefined 问题
在路由前置守卫中监听 to 及 from 的变化，发现 router.push 跳转路由时，会发现打印出 两次以上的 to、form 对象，只有第一次打印的from对象是正确的，而后两次都是由于 qiankun 与vue-router 不兼容引起的路由守卫重复执行的问题导致的，当重复执行三次以上时，用户点击浏览器左上角的回退按钮会出现路由显示undefined，导致页面404不展示。解决方法：使用 window.history.pushState() 代替 router.push() 方法。
2023-07-10 18:28:59
996
原创 前端如何实现excel文件上传到服务器
前端如何实现excel文件上传到服务器？我的需求是：用户上传文件后，不自动上传到后台，需要另外点击上传按钮后再上传到后台。
2022-12-09 15:00:50
1188
原创 XMLHttpRequest-原生Ajax写法
xhr 的 readyState 属性表示当前Ajax请求所处的状态，open()函数的第三个参数表示是否开启异步请求，false:同步；true：异步，数据交换格式：服务器端与客户端间进行数据传输与交换的格式
2022-11-09 22:41:15
320
1
原创 form表单有大知识
表单的同步提交及缺点：缺点：1.页面会发生跳转；2.页面之前的状态和数据会丢失解决方案：表单只负责采集数据，使用Ajax将数据提交到服务器当前端无法解决跨域，又需要发送请求时，可以通过表单提交来解决
2022-11-08 22:08:06
1947
原创 富文本编辑器 quillEditor 的使用方法
装包 vue-quill-editor 和高亮插件 highlight.js。vue2项目需要注册，vue3项目不需要注册。
2022-09-24 09:00:00
889
原创 如何统计前端项目有多少行代码
如果还有其他文件，可继续添加如 -or -name "*.json"，需要注意的是：注释也被统计在代码行数之内。需要文件名作为参数，因此需要将find命令找到的文件名，使用xargs作为参数传递给wc命令。xargs命令：将管道的标准输入转换为下个命令的参数。设置了find命令的搜索路径：将find的顶层目录设置为当前目录，即从当前目录开始搜索。-l参数：只显示行数。3. 回车后会显示当前项目的路径，可修改路径，选择你需要计算代码行数的目录。|：管道，大体作用就是把前面命令的输出，作为后面命令的输入。
2022-09-20 19:00:00
7786
原创 element组件踩坑记录
解决方法：在获取表格数据的时候，使用组件提供的 toggleRowSelection 方法，切换某一行的选中状态，进行多选框的回显，此方法也可实现切换分页时的回显，需要注意的是 使用 toggleRowSelection 方法 必须使用绑定table的原有数据，不可使用传入的参数，否则方法会无效。解决方法：可以给el-table绑定row-key属性，用来优化 Table 的渲染；解决方法：给 el-table 绑定 key 值，在需要更新时 this.num++，触发 el-table 的重新渲染。
2022-09-18 18:23:27
2256
原创 前端如何用mockjs插件模拟接口调用
当前端的静态页面铺设完成，而后端的接口还没有写好时，可以询问后端返回数据的格式，使用 mockjs 来模拟后端接口的调用。
2022-09-17 17:12:14
365
原创 如何将canvas截图插入dom中以及如何将canvas转为文件对象并下载到本地
如何将canvas截图插入dom中以及如何将canvas转为文件对象并下载到本地
2022-09-01 18:15:00
776
原创 如何制作组织结构echarts图，并结合formatter和rich制作好看的样式，同时解决echarts渲染报错和引入图片报错的问题
如何用echarts制作组织结构图，并结合formatter和rich制作好看的样式，同时解决echarts渲染报错和引入图片报错的问题
2022-08-30 18:45:00
2382
原创 如何使用sortablejs拖拽库并封装成组件
var sortable = Sortable.create(el，{配置内容}）使用sortablejs拖拽库并封装成组件
2022-08-18 14:41:02
495
原创 at ./node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js
安装好 react 脚手架，第一次启动 react 项目发现页面不展示，且控制台报错 这是由于我们的谷歌浏览器安装了 react-devtools 扩展程序导致。根据这篇文章查到的解决方案：1. 禁用 react-devtools 扩展程序2. 更换浏览器3. 根据路径找到文件node_modules/@pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js，将下面这行代码注释掉，然后重启项目即可 但是我用第三种方法不管用，项目仍然报错
2022-07-04 16:42:12
1963
原创 vite.config.js或者vue.config.js配置
import { defineConfig } from "vite";import { resolve } from "path";import vue from "@vitejs/plugin-vue";import { createSvg } from "./src/icons/index";export default defineConfig({ // 添加svg插件 plugins: [vue(), createSvg("./src/icons/svg/")], /...
2022-06-28 17:56:02
4326
原创 vue3中如何按需引入vant组件库并进行rem适配
1.安装vant3组件库2.安装官方提高插件3.如果是基于 的项目，在 文件中配置插件：（基于其他项目，参加官网）4.在src文件夹下新建plugins文件夹，添加vant.js文件，注册你需要的组件5.在main.js中引入6.使用...............
2022-06-17 10:02:51
4536
原创 前端如何下载excel表格
下载excel1.1下载表单，需要自己配置，引用别人封装好的ts文件import { downloadXlsxFile } from "./downloadFile"; //引入自定义xlxs tsconst form = reactive({val:{}form.val=res.data.trsCircuit; const labelAll = { aaddress:'A端装机地址', abuzPort: "A端业务设备端口",
2022-05-10 13:49:54
4255
原创 svg组件封装
npm install svg-sprite-loader -Svue2src/components/SvgIcon/index.vue<template> <svg :class="svgClass" aria-hidden="true" v-on="$listeners"> <use :xlink:href="iconName" /> </svg></template><script>expo.
2022-05-05 14:15:08
1379
原创 热力图echarts的实现
判断一个点是否在多边形二维数组内部 /** * @description: 判断点是否在多边形内部 * @Author: wangxiaomiao * @param {Polygon} [[100,150],[110,112],...] * @param {Point} [240, 240] * @return {*} true 在多边形内部 false 不在多边形内部 */ isPointInPolygon(Polygon,
2022-04-22 11:13:00
1037
原创 下载图片功能，全屏功能，复制功能
下载图片功能 <img src="@/assets/routeimg.jpg" id="routeImg" @click="downloadRouteImg('routeImg', '路由图')" />const downloadRouteImg = (id, nameStr) => { var oQrcode = document.getElementById(id); var url = oQrcode.src; .
2022-04-19 17:50:10
85
原创 vue项目实现鼠标拖拽功能
<div id="back" @mousedown="draggableFun($event)" >// 返回按钮点击事件const goBack = () => { store.showDetail = false;};// 鼠标拖拽事件const draggableFun = (val) => { var div = document.getElementById("back"); var dragFlag = false; v.
2022-04-18 15:46:31
6429
原创 图片边框border-image
1. 使用图片当做边框，必须先设置边框 border2. 图片边框不占用空间。div里如果放内容，内容还是和border有关系，和border-image没有关系3. 盒子不能太小，至少应该把图片边框显示完整。border-image:图片地址 切割位置/图片边框的宽度 效果(默认是拉伸) //复合写法 border-image: url('./images/border.jpg') 167/20px; // border-image-s..
2022-04-08 14:26:14
924
原创 在vue项目中使用html2canvas将html内容写入canvas生成图片
安装 html2canvas 包npm install --save html2canvas或者yarn add html2canvas -S在需要使用的页面引入import html2canvas from "html2canvas";html代码<div id="targetDom">需要生成图片的盒子</div><button @click="creatPic">点击生成图片</button>js代码 c
2022-04-06 17:54:35
1288
2
转载 display:grid 网络布局
Grid布局与display:flex 弹性布局有一定的相似性，都可以指定容器内部多个项目的位置。但是，Flex 布局是轴线布局，只能指定"项目"针对轴线的位置，可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列"，产生单元格，然后指定"项目所在"的单元格，可以看作是二维布局。Grid 布局远比 Flex 布局强大。Grid 布局只对项目生效，不包含项目的子元素。
2022-04-01 17:14:35
2008
原创 vue2中如何按需引入vant组件库
安装vant官方提供的插件# 安装插件npm i babel-plugin-import -D在 babel.config.js 中配置module.exports = { presets: [ '@vue/cli-plugin-babel/preset' ], plugins: [ ['import', { libraryName: 'vant', libraryDirectory: 'es', style: tru.
2022-03-28 16:53:23
4004
6
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人