- 博客(55)
- 资源 (4)
- 收藏
- 关注
原创 vue antd table嵌套表格 左侧展开图标动态控制显示隐藏
大家如果用的版本不一样,可以控制台看下它默认渲染的图标类名是什么,直接复杂过来替换掉就可以了,完美!关键在于#expandIcon设置自定义图标,效果跟默认的效果一毛一样。我使用的是antd4,所以图标的类名是。
2024-03-14 21:24:23 1184
原创 element的table组件实现表头动态合并
设置为row[0].rowSpan = 3,其他两行就设置成display: "none”拓展↓:如果还想在表头最前面的位置加一列日期呢。然后发现是不行的,表头会错乱。
2023-05-30 23:45:21 1415 1
原创 web微信授权登录-代码篇
上篇讲了我们做微信授权登录前,需要在微信后台做的一些配置准备。现在到我们页面内部:代码如下:1、定义一个getUrlKey方法,来判断当前地址是否有code字段。(因为授权过的地址会自动拼上code,一般也就是要拿这个code值传给后端的接口)2、myAppid是我们的微信appID3、redirectUrl是我们授权后,页面再次重定向要跳转回来的地址,就是我们当前的页面地址 let wxUserCode = getUrlKey("code");
2022-02-13 16:41:16 1340
原创 web微信授权登陆-配置篇
大家做微信网页授权登陆时,大家可以通过自己在微信后台设置,实现自测授权登陆。步骤如下:打开链接 用微信登录:微信公众平台在页面内按照如下步骤操作:一、
2022-02-13 16:12:56 1420
原创 antd4中form表单shouldUpdate的用法
效果如下:(左右点击切换,展示隐藏的部分)react中用form表单提交,要实现上图的效果,通常写法如下:<Form.Item label="设备价格" shouldUpdate={(pre: any, cur: any) => pre.price !== cur.price} > { ({ getFieldValue }) => { ...
2021-06-02 01:07:50 8328
原创 js中数组的number或string类型转换 及其他api
将String类型的数组转为Number类型:a.map(Number)将Number类型的数组转为String类型:a.map(String) let a = ['1', '2', '3']; let b = [4, 5, 6]; console.log(a.map(Number)) console.log(b.map(String))打印结果:替换字符串中指定字符:a.replace(/指定字符/,'替换后的...
2021-01-17 20:17:49 1843
原创 修改React项目启动的IP和端口号
在package.json文件:把默认配置:"start": "umi dev"改成:"start": "set PORT=8001 && umi dev"或者:"start": "set PORT=8001 HOST=192.168.1.103 && umi dev"
2021-01-17 19:01:09 4861
原创 && 与 ||在React中条件渲染的用法
在React开发中,我们经常会用到html的条件渲染,如使用三目运算来判断展示哪个html let a = true return ( <div> { a ? <div>111</div> : '' } </div> )利用&& 或者 || 运算符的短路写法可以实现更简的代码。 const q
2021-01-17 18:19:10 1873
原创 React实现动画锚点滚动效果,不改变路由
React实现锚点滚动,我个人用在填写过长form表单信息时,提交有未填写项,则自动滚动到对应信息位置。使用scrollIntoView,H5新增API:https://developer.mozilla.org/zh-CN/docs/Web/API/Element/scrollIntoView代码如下://滚动到指定锚点 scrollToAnchor = (anchorName: any) => { let state: any = { behavi.
2020-06-17 15:04:10 1510
原创 react脚手架安装命令行
淘宝镜像命令:npm install -g cnpm --registry=https://registry.npm.taobao.org1.全局安装命令:cnpm install -g create-react-app2.在自己的文件路径下:create-react-app my-projectName3.运行:cnpm start项目如下:在根目...
2019-12-12 15:14:27 1757
原创 win10下MongoDB的安装与配置
官网下载路径:https://www.mongodb.com/download-center/community下载完之后双击,一直next安装,其中这一步选择Custom注:这里取消InstallMongoDBcompass,自己安装一个可视化的工具,不然安装时间超长长长一开始我没勾选取消,安装了好久进度君都没反应,后面又手动卸载了全部文件再重新安装的,所以一定要取消...
2019-12-04 11:50:11 3224
原创 解决fullpage滑动,控制台的报错提示
应用fullpage移动端滑动效果,但控制台一直有报错提示[Intervention] Unable to preventDefault inside passive event listener due to target being treated as passive. See <URL>解决:给html 添加 touch-action: none;属性...
2019-11-21 17:02:02 353
原创 vue form表单数据提交
利用v-model能比较便捷地上传用户信息的数据,不用一个个参数地拼接。直接在data根据要传的字段定义一个对象,再利用双向绑定得到值。下面写了传json格式跟formData格式的两种情况,根据实际参考<template> <div class="from_box"> <form action=""> <input ty......
2019-07-28 19:21:38 104038 8
原创 vue批量验证form表单数据
批量验证用户表单栏是否为空,正则判断是否正确参考文章:https://www.cnblogs.com/cengjingdeshuige/p/10185693.html然后进行了部分代码更改如下:<template> <div class="from_box"> <form action=""> &l...
2019-07-28 19:17:39 10945
原创 vue keep-alive案例全教程
该dome一个案例是用keep-alive实现 'form表单' 点击跳转 '阅读活动协议页' 再返回表单数据不刷新进行缓存。另一个是keep-alive实现 '信息列表页' 滚动到某一位置点击跳转'详情页'再返回,保留列表上次滚动到的位置。而且用keep-alive来实现这些效果,比使用vuex或者sessionStorage这两种方法要合理,不用重复调本地缓存,再渲染。效果图:...
2019-07-28 19:02:50 3103
原创 css引入自定义字体 字体压缩
随便一个网站下载字体:https://www.fontke.com/再随便一个网站字体转换格式:https://www.fontke.com/tool/convfont/效果:<!DOCTYPE html><html><head> <meta charset="utf-8"> <m...
2019-07-23 23:03:18 2004 1
原创 gulp-rev-collector自定义rev-manifest.json后缀格式
修改源码,将common-1d6407e386.css文件命名格式改成common.css?v=1d6407e386(1)打开node_modules/_gulp-rev/index.js135行: //manifest[originalFile] = revisionedFile;//注释 manifest[originalFile] = originalFile + '?...
2019-07-18 00:44:34 439
原创 gulp-autoprefixer运行时错误警告处理
gulp自动化打包中,使用gulp-autoprefixer能自动给css样式添加兼容前缀,后面我想按api的写法添加属性设置时运行时出现了错误提示:大概意思就是使用'browsers'导致了一些错误,如果确实需要使用选项,请将其重命名为'overrideBrowserslist'。应该是gulp-autoprefixer版本更新了,写法变了,我的版本是"^0.0.15"更改如下:...
2019-07-18 00:42:35 940
原创 用vue-cli3.0安装脚手架
vue-cli 3.0 正式版在18年 8月10号发布了!作为前端,当然是得赶紧用起来才能跟上脚步,而且不用不知道,一用就会爱上,因为3.0的版本,比2.0的配置文件简洁了很多,它好像是将大部分配置都放在了node_modules里面了。所以生成的脚手架只有两个主文件夹了。因为我电脑之前用的是vue-cli2.0,所以要先卸了2.0的先: npm uninstall -g vue-cl...
2019-06-05 14:39:12 7888
原创 npm更新命令行
查看自己npm ,跟node版本:npm -vnode -v使用命令行升级npm: npm install npm@latest -g
2019-04-23 17:25:43 9055
原创 Hbuilder将less自动编译成wxss
在开发小程序的时候我用的是Hbuilder,因为自己想用less预编译css样式,琢磨了下,发现了方法。打开Hbuilder -> 工具(T) -> 预编译器设置把.css改成.wxss点击确定就可以了 ...
2019-02-25 15:32:11 1416 1
原创 H5实现移动端,PC端页面分享
想做个页面分享功能,既要兼容移动端,也要兼容PC端。找了一轮,决定PC端用百度分享的api:http://share.baidu.com/code/advance移动端一开始想用soshm.js,发现ios没问题,但安卓手机在微信上点微博完全没反应:http://www.calledt.com/soshm/于是改用了nativeShare.js:https://github...
2019-01-30 11:48:27 9486 1
原创 H5点击生成图片dome
最近琢磨想在移动端实现点击按钮保存图片的功能。在网上搜了好久,发现普遍的方法是:html2canvas.js实现把html转图片,canvas2image.js则实现图片的下载。把网上的案例套用之后发现html转图片没啥问题,但是到了下载图片一堆bug啊,ios浏览器点击下载都是直接到一个图片的链接,再手动长按保存。安卓跟ios在微信打开都是'点击下载'是完全没反应啊,老爹。这样就玩不...
2018-12-27 01:02:06 4834
原创 解决ios底部固定输入框,获取焦点时弹出输入法键盘挡住输入框
ios端比较常见的,就是在页面底部固定的输入框,如下,一旦获取焦点,弹出的输入法键盘就会把input输入框完全挡住,解决方法很简单,加上下面的几行代码即可 $(".replay_text").on("click", function() { setTimeout(function(){ document.body....
2018-11-01 09:30:07 5273
原创 H5页面唤起指定app,有就唤起,没有则跳转下载页
点击按钮,当已经安装了app则调起,否则跳转到应用宝或者App store下载页面(普通浏览器兼容,微信有权限限制,只能每次跳转下载页)<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=de
2018-10-25 15:10:03 9595 1
原创 input完美实现无闪烁只能输入1到999的整数
输入数字第一位不能为0,不能输入小数点,中文,英文。且输入整数以外的内容时,输入框违规内容不会一闪而过 <input type="tel" oninput="var v=this.value||'';v=v.replace(/[^\d]/g,'');if(v.length==1 && v==0){v=''};this.value=v.substr(0,3);"&...
2018-10-18 14:17:27 4581
原创 vue导航守卫beforeRouteLeave浏览器返回时,自定义弹窗提醒用户保存信息
H5页面中经常会遇到的情况,当前页面点击返回,想要提示弹窗"是否确认离开当前页面"之类的需求。自己试着看了一下网上的方法,大多是alert出系统弹窗。其实要实现自定义弹窗提示,也是很容易的。从另一个页面点击跳转到当前页(如下),点击浏览器返回按钮,则会弹窗下面的弹窗,点击弹窗确定按钮,页面返回上一页 完整代码:<template> <div class="...
2018-10-17 13:57:23 19894 4
原创 vue步步深入(四)项目编写,路由配置
1.在App.vue页面写需要的组件<template> <div id="app"><!--这个到时候会替换掉index.html的#app的DOM元素--> <m-header></m-header> <tab></tab> <router-view>
2018-06-10 21:31:07 584
原创 vue步步深入(三)脚手架文档的基本结构和处理
1."static"文件夹可以放静态资源2."src"文件夹里自动生成的几个文件夹可以删掉,后面我们可以建自己需要的文件夹3."App.vue"里面可以先删掉多余的东西,只留下最简单的模板<template></template><script>export default { }</script><st
2018-05-20 13:11:02 677
原创 vue步步深入(二)package.json文件介绍和使用
1.运行项目,命令行:npm run dev2.“dependencies”依赖包,需引入页面使用3.“devDependencies”生产环境,只是开发阶段需要4.在给“dependencies”手动输入"fastclick": "^1.0.6",安装fastclick插件。再在命令行中输入:...
2018-05-19 17:44:36 27817
原创 vue步步深入(一)环境搭建
1.npm命令行:vue init webpack 文件夹名字2.再写项目名,一般小写3.上下键控制选择,选择下面6KB轻量级那项,回车4.接下来的步骤如下图操作:这样项目初步的脚手架就搭好了,生成的文件夹目录如下:5.再输入命令行,进入AppleMusic文件夹cd AppleMusic6.输命令行,安装所有的依赖包npm installpackage.json文件介绍1.运行项目,命令行:np...
2018-05-18 23:53:28 645
原创 禁止safari自动识别数字为电话号码,强加样式
写移动端页面时,一次在iphone手机的safari浏览器打开页面,突然发现每次页面加载完底部的电话号码,都会突然样式失控,变成不是自己最开始设置的效果,如下图一开始还以为自己样式不合理,后来终于发现是safari搞鬼,只需在页面头部加一句,就可以解决了:<meta name="format-detection" content="telephone=no" />...
2018-04-28 23:40:27 2143
vue-keepAlive-template.rar
2019-07-17
web移动端,PC端页面分享
2019-01-28
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人