业务
常见业务需求
南城夏季
一路浅行
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
css画一个缺了右边三角形的长方形
画一个缺了右边三角形的长方形。原创 2024-05-17 17:44:56 · 668 阅读 · 0 评论 -
前端设计模式
不变的部分:算法的使用方式不变,都是根据某个算法取得计算后的工资数额;我们可以把不变的部分和变化的部分拆分开来。变化的部分:算法的实现。原创 2023-12-28 09:59:48 · 723 阅读 · 0 评论 -
react ant upload上传请求参数变成了 file:[object object]
文件对象需要取里面的一层,即originFileObj。原创 2023-09-15 14:30:53 · 934 阅读 · 0 评论 -
react ant table 根据接口动态渲染表头
使request获取list,renderFormItem回调里面第二个参数中就有request的返回值,根据这个去渲染就可以了。原创 2023-07-13 11:10:36 · 1585 阅读 · 0 评论 -
react ice 打包失败
可以看到图片路径找不到,但是实际上项目的图片路径是对的,复制地址可以打开图片,那是哪里的问题呢,其实这里粗心了,项目路径有中文导致打包时无法正确找到对应文件,把不良品这个中文换成英文就可以了。原创 2023-05-09 10:13:13 · 251 阅读 · 0 评论 -
react ice3 配置postcss-pxtorem
【代码】react ice3 配置postcss-pxtorem。原创 2023-04-28 17:28:46 · 596 阅读 · 0 评论 -
js关闭其他标签页
场景: 你自己是a网站,你要新开一个tab页跳转到外部b网站,在b网站操作完成后,关闭b网站。原创 2023-03-14 15:58:10 · 897 阅读 · 0 评论 -
h5在小程序中调用微信扫码功能
目前扫码模块是用原生小程序写的页面,登录和之后跳转的页面都是通过webView嵌套在小程序里面的h5。原创 2023-02-28 14:53:55 · 3128 阅读 · 0 评论 -
js在pc端调用摄像头拍照使用getUserMedia报错undefined
百度了才知道是本地起的服务不是https,获取不到摄像头权限。目前有个需求是要在微信浏览器中进行人脸,想到的一个方案是前端进行拍照然后传给后端调用第三方服务进行人脸校验。方法,想在pc端进行设置,发现pc端是没有这个方法的。然后点击重启按钮就可以了。原创 2022-11-09 17:30:40 · 1136 阅读 · 0 评论 -
手写简易vue响应式
【代码】手写简易vue响应式。原创 2022-10-21 16:44:39 · 366 阅读 · 0 评论 -
js代码简写
【代码】js代码简写。原创 2022-10-21 12:05:24 · 166 阅读 · 0 评论 -
ant日历组件calendar转中文以及消息渲染
这里加入了完整的日历消息展示,消息从接口中获得,返回的是日历面板上每一天的消息信息,然后展示在日历中,如果只是需要转中文,则只需要看转中文的几个方法。最终的效果,可以直接在每天卡片上显示消息,也可以悬浮显示每天的消息。目前使用的项目用的是ice+ant+react ,项目中使用了calendar组件,但是组件中的星期,年份,月份都是英文的,按照官网的配置了转中文没有起作用。由于官网的配置没有生效,所以使用了一个最直接的方案:直接替换英文的dom节点的内容为中文的。原创 2022-09-30 14:56:04 · 1820 阅读 · 0 评论 -
react ice 不兼容火狐低版本浏览器
目前使用的是ice结合ant来开发的react项目,但是运行后在谷歌浏览器和ice浏览器没有问题,但是在火狐的低版本(2016之前的版本,基本是在版本号50以下的)上运行打开页面显示一片空白,并且没有任何的错误提示。一开始分析是不是react版本过高导致不兼容,后来查看老项目,发现react16照样可以在火狐50运行,于是排除了react的问题。现在页面可以打开了但是接口返回的是一个xml对象,并不是json对象。查看ice的配置,发现默认是使用了vite,于是在。原创 2022-09-27 09:56:32 · 1219 阅读 · 0 评论 -
node-sass安装报错
一般都是node和node-sass的版本不兼容。原创 2022-09-23 15:28:38 · 388 阅读 · 0 评论 -
react antv(Ant Design Charts)怎么使用图表事件
【代码】react antv(Ant Design Charts)怎么使用图表事件。原创 2022-09-08 15:26:56 · 2086 阅读 · 1 评论 -
react ant table 表格合并单元格
将行数据中公司名相同的数据进行合并。原创 2022-09-07 13:50:49 · 703 阅读 · 0 评论 -
react set值会导致表单重置而清空数据
当输入完姓名的时候,需要把输入的姓名添加到关联对象的下拉框中供用户选择。但是输入姓名后,将值set到关联对象后,表单直接就清空了。在set后会自动清空表单,所有我们可以通过异步来恢复表单数据。原创 2022-09-02 11:30:15 · 972 阅读 · 0 评论 -
ant pro-table点击表格行高亮显示
直接在onRow事件中,捕捉到当前的节点,然后设置它高亮,然后再设置其它行的节点恢复默认样式。原创 2022-08-23 14:16:29 · 1095 阅读 · 1 评论 -
git 更换文件名大小写无法提交 远程和本地不一致
这样下次提交的时候就会观察到本地和远程不一致的文件名和文件夹的名字。3、再将文件恢复,再次提交到git即可。2、删除对应文件并提交到git。1、先将要提交的文件备份。原创 2022-08-04 10:17:13 · 1490 阅读 · 0 评论 -
react自定义右键事件
右键显示弹窗 const handleContextMenu = (e) => { e.preventDefault() // 此条件下才展示弹窗 if (e.target.nodeName === "DIV" && e.target.innerText !== "首页") { const x = e.clientX const y = e.clientY // 弹窗节点 const rightMenu = d原创 2022-05-12 17:44:22 · 2982 阅读 · 0 评论 -
页面间同步状态一般都有哪些方案,跨页面通信
页面间同步状态一般都有哪些方案,分别的应用场景都是哪些1. 通过storage事件:(同源)不同tab的js执行环境是不同的,因此变量不会共享,watcher也不会互相影响。可以利用 storage事件监控localstorge的变化 ,storege事件只能注册在window上只有当存储的值改变时才会触发storage事件,即新值与旧值不同触发写入操作的页面下的storage listener不会被触发即使页面不再同一个浏览器窗口(比如打开两个Chrome浏览器实例),storage也能够触原创 2021-12-23 16:33:29 · 1491 阅读 · 0 评论 -
type check failed for prop “value“. Expected String, Number, got Null.
vue项目渲染from表单的时候报错:type check failed for prop "value". Expected String, Number, got Null.这种情况大多出现在Select下拉框中,是由于渲染项目含有null,例如: <FormItem prop="inventorybbcClearanceCode" label="配置1210清关申报主体"> <Select v-model="form.inventorybbcClearan原创 2021-12-21 16:20:02 · 3440 阅读 · 0 评论 -
注册发布自己的npm包
1. 注册npm地址输入账号,密码,邮箱然后去邮箱验证,验证完再继续下面的操作,不验证的话,npm publish会报4032. 创建npm包1.npm init生成package.json文件,里面的name值可以取一个特殊点名字,以免发包的时候包名冲突导致发布不上{ "name": "longweixiahao", "version": "1.0.0", "description": "", "main": "index.js", //注意这里指向我们暴露的入口文件 "原创 2021-12-16 17:24:04 · 1778 阅读 · 0 评论 -
Github Actions 自动构建前端项目并部署到服务器
参考文章在开始操作之前,需要先在项目仓库建立page站点。1. 创建yml文件在你需要部署到 Github Page 的项目下,建立一个 yml 文件,放在 .github/workflow 目录下。你可以命名为 ci.yml,它类似于 Jenkins 的 Jenkinsfile 文件,里面包含的是要自动执行的脚本代码。文件内容为name: A TO A:GH_PAGESon: # 监听 master 分支上的 push 事件 push: branches: - ma原创 2021-12-16 12:20:23 · 1927 阅读 · 0 评论 -
手撕发布订阅模式 eventBus
1.手撕发布订阅模式 eventBus什么是发布订阅模式比如我们很喜欢看某个公众号号的文章,但是我们不知道什么时候发布新文章,要不定时的去翻阅;这时候,我们可以关注该公众号,当有文章推送时,会有消息及时通知我们文章更新了。上面一个看似简单的操作,其实是一个典型的发布订阅模式,公众号属于发布者,用户属于订阅者;用户将订阅公众号的事件注册到调度中心,公众号作为发布者,当有新文章发布时,公众号发布该事件到调度中心,调度中心会及时发消息告知用户。1-1. eventBus的基本使用我们要实现eventBu原创 2021-12-14 15:06:08 · 1601 阅读 · 0 评论 -
[vite] Internal server error: Failed to parse source for import analysis because the content contai
报错:[vite] Internal server error: Failed to parse source for import analysis because the content contains invalid JS syntax. Install @vitejs/plugin-vue to handle .vue files.安装@vitejs/plugin-vuecnpm install @vitejs/plugin-vue --save安装完后记得重新cnpm install原创 2021-12-13 12:11:56 · 10060 阅读 · 6 评论 -
js金额转换为千分位格式
/** * 金额转换为千分位,例:2000=>2,000 * @param {number} number 要格式化的数字,例:2000 * @param {number} decimals 保留几位小数,例:2 * @param {string} dec_point 小数点符号,例:'.' * @param {string} thousands_sep 小千分位符号,例:',' * @param {string} roundtag 舍入参数,默认 'ceil' 向上取,'floo原创 2021-12-08 15:05:17 · 806 阅读 · 0 评论 -
网络图片url转base64
getBase64(imgUrl) { let _this = this var xhr = new XMLHttpRequest() xhr.open('get', imgUrl, true) xhr.responseType = 'blob' xhr.onload = function() { if (this.status == 200) { var blob = this.response原创 2021-12-08 14:13:24 · 777 阅读 · 0 评论 -
input[type=“file“] change事件第二次不触发
问题:用input上传图片时,如果第二次传递的跟第一次是一样的图片,那么此时会出现:change事件不再触发。代码:<input type="file" ref="upload" id="imgUrl" @change="uploadChange" accept="image/jpg, image/jpeg, image/png" />解析:首先这种情况是正常的,不是bug,我们可以看到,每次上传的时候input右侧都有一个文件名。那么change事件会根据这个文件名val原创 2021-11-15 17:12:23 · 3918 阅读 · 0 评论 -
iview 的table表格组件怎么使单元格可编辑和输入
iview的官方文档没有给出可以编辑表格的属性,但是有时候我们有这个需求,希望直接在表格上改数据,就需要编辑功能了表格的列定义中,在需要编辑的字段下使用render函数template表格组件<Table border :data="detailData.vos" :columns="table.cols" :loading="table.loading"></Table>data中定义table对象 table: { cols: [ .原创 2021-04-01 10:05:51 · 1368 阅读 · 0 评论 -
vue路由跳转总是跳转到首页,路由匹配不上
1.先看路由配置文件: { path: 'detail/:No', name: 'waybill-declaration-detail', component: () => import('@/views/wayb/Detail'), meta: { redirect: true, title: '运单' } }2.编写跳转事件click: () => {原创 2020-11-23 12:27:00 · 4893 阅读 · 0 评论 -
vuepress不能热更新怎么解决
修改package.json文件的dev字段,将: "scripts": { "dev": "vuepress dev docs", "build": "vuepress build docs", "test": "echo \"Error: no test specified\" && exit 1", "deploy": "bash deploy.sh" },改为以下: "scripts": { "dev": "vuepres原创 2020-11-06 10:42:04 · 2233 阅读 · 2 评论 -
less的常用语法总结和案例
1.变量常用于定义属性值,让我们可以统一维护和修改,减少重复的操作。@brightRed: #FF3163; //定义属性值值的变量// 亮红色.brightRed { color: @brightRed; //使用变量}2.混合多个元素有相同的属性时,可以将公共的属性抽离出来,然后引入。2-1:直接混合.tool-row { //公共样式,add-receiving-address和del-address都拥有的样式 height: 42px;.原创 2020-10-10 12:10:16 · 859 阅读 · 0 评论 -
vue 点击左侧菜单右侧视图切换
1.业务需求:点击左侧的侧边栏菜单,希望只更新右侧的视图,实现这种局部更新的效果。这里就需要用到Vue的路由控制了。2.实现:2-1 在router.js中:截图:router.js完整代码:import Vue from 'vue'import VueRouter from 'vue-router'import Home from '../views/Home.vue'import center from '../views/center.vue...原创 2020-09-28 12:35:14 · 15449 阅读 · 15 评论 -
js Number()会改变值的大小
记录个bug问题:由于调用接口,后台需要传递一个数值,为120531784730937088,并且是integer类型,但是前端获取的值为字符串:"120531784730937088"所以要将"120531784730937088"转换为number类型var a = Number("120531784730937088")打印a发现失去精度了,值为120531784730937090原因:js的number类型有个最大值(安全值)。即2的53次方,为9007199..原创 2020-09-04 11:41:24 · 815 阅读 · 0 评论 -
vue如何实现点击一篇文章后,文章的访问量增加1个
实现的逻辑是:前端每调用成功一次页面数据接口,就相当于阅读了一次文章,前端获取到数据成功后,将访问量字段的值自增1个,然后将增加后访问量字段再传给后端,保存在数据库中代码实现: getArticle(index, types, idIndex) { this.axios .get("articles/get") .then(res =>...原创 2020-04-09 23:40:24 · 3954 阅读 · 0 评论 -
在vue工程中引入swiper
1.下载依赖npm install swiper2.引入依赖import Swiper from 'swiper';import 'swiper/dist/css/swiper.min.css';3.使用swiperjs: mounted() { var mySwiper = new Swiper(".swiper-container", { ...原创 2019-09-08 23:23:44 · 317 阅读 · 0 评论
分享