RealizeInnerSelf丶

转载 （keep-alive）首页进入页面刷新，子页面返回页面缓存

首页或其他版块进入列表页面刷新数据、页面状态（滚动条、筛选条件、数据结果），从子页面返回时列表状态、数据情况维持进入子页面前的状态

转载 vue 使用 keep-alive 进行组件缓存方法详解(组件不缓存问题解决)

讲一些 keep-alive 的使用和应用场景

原创 浏览器输入框自动填充默认样式移除

账号密码框在浏览器保存了密码的情况下会自动填充，且用户也会需要自动填充，但是填充后会有个很讨厌的默认样式，难以去掉

原创 本地可以传大于1M的图片，连线上后无法上传，报错：Access-Control-Allow-Origin & 413 (Request Entity Too Large)

但是小程序要求使用域名，而使用域名时就会报这个错。

原创 HbuilderX 项目打包文件过大问题优化

遇到小程序代码包超大小时的一些解决思路

原创 解决 edge 浏览器开发者工具出不来的问题

当需要用开发者工具进行调试时却发现不打开了……好在我解决了，希望能帮到同样遇到这个问题的你~

原创 uniapp 打包小程序体积优化思路、优先排查优化项参考

无用文件删除（可能一些项目是老项目基础上改的，会有很多无用的业务代码文件，可以直接删除，或是用不到了的字体文件、图片等资源）字体资源、图片资源改为引用线上的，而非本地（传到服务器可访问后，记得把本地的删除掉）分包（除了首屏页面、登录页、tabbar页面，其他页面都可以考虑分包的方式）各类第三方类库尽量使用按需引入的方式。

原创 webpack

周末学习一下 webpack，提升一下自己。

原创 Chrome/Edge 浏览器多账号登录，测试同一业务系统的不同账号角色

虽然说用不同浏览器测试也比较方便、还能顺带测试多浏览器兼容问题……但我是开发呀，我只想用我最习惯的谷歌浏览器完成快速开发，把功能铺上，专注于业务逻辑的开发这些浏览器差异等只会给我造成麻烦，影响我的开发沉浸感，打乱我的开发节奏，等功能开发完再去处理再去测试兼容性之类的问题才是我的习惯

原创 SVN 导出改动差异文件

当然下面的两个场景介绍可能用分支管理都会有不错的效果，或者更优，只是记录一下思路，用什么还是看大家个人爱好啦在开发过程中偶尔会遇到有 bug 不知道具体问题出在哪，需要一步步删减代码去分析我的常见操作是备份一份代码，在找到问题后将问题处的改动同步过来，但很大概率会改着改着就忘掉了自己之前改动了哪几个文件，不清楚这一次的改动哪些是无关的， 需要还原的有时还会在开发过程中发现当前的技术方案太过复杂，或者遇到障碍暂时无法突破，需要换一种方案实现的情况。

原创 我对 ChatGPT 进行多方位了解后的报告，超级全面，建议想了解的朋友看看（截至 2023.5.17）

这是我花了近3周时间了解 ChatGPT 后写的报告，感兴趣的朋友赶紧来看看吧，包你收获满满~（截至2023.5.17）

原创 让 ChatGPT 自己告诉你如何与它高效交流（终稿）

本文内容是自己在接触、了解、使用 ChatGPT 一段时间（约2周），且有了一定经验总结后，用 ChatGPT4 基于多次问答、矫正最终得出的文章，文章内容对于如何与 ChatGPT 交流有一定的参考价值，主要用来方便大家对 ChatGPT 有个大致的了解，满足大家的好奇心，并对提供一个真实体验参考

原创 让 ChatGPT 自己告诉你如何与它高效交流（对话全过程展示，请自行感受）

在本博客中，我们介绍了与 ChatGPT 高效交流的方法和技巧。

原创 Edge 浏览器装插件安装的别样思路

常常会有一些插件在 edge 浏览器上搜不出来的情况（比如这两天比较火爆的 chatgpt，一些插件在 edge 扩展商店里就搜不到，而谷歌扩展商店里有）在网上搜不一定能搜到，搜到的第三方网站可能也存在一定的风险，然而相对靠谱的第三方插件网站并不一定有收录那么就下不到了吗？就只能找别人去要安装包了吗？当然不是，本文记录两种这两天无意间点出来的方式

原创 Everything 搜索失败问题解决

平时用的好好的 Everything 突然某一天用不了了，什么东西都搜不出来了……就搜桌面上摆着的文件都搜不出来……

原创 SVN 获取多版本间的更新内容

怎么能快速知道这些版本之间变更了哪些内容呢？如何操作？

原创 uniapp 项目的 echarts 图表本地可以展示，同事打包后 echarts 图表无法显示

我让打包代码的同事在本地运行代码查看，发现他本地就无法显示图表，稍作思考后怀疑是他 没有装 **百度图表 echarts** 插件 所致，故让他装了一下，然后再运行，图表就能显示了，至此问题就解决了

原创 lunar.js 基本使用学习笔记

目录lunar.js 基本使用学习笔记介绍基本使用部分文档 API 转载阳历相关的方法 APISolar 阳历阳历实例化阳历对象可以使用多种字符串输出方式：获取年、月、日儒略日获取星期判断是否闰年获取节日星座阳历日期推移(可跳过节假日、*六*日)公历转阴历(农历)SolarWeek 阳历*阳历*实例化阳历对象转化为字符串获取阳历日期的年月日获取一*的起点获取当前日期是在当月第几*，返回序号从1...

原创 lunar.js 基本使用学习笔记

lunar 是一无第三方依赖的公历(阳历)、农历(阴历、老黄历)、佛历和道历工具支持星座、儒略日、干支、生肖、节气、节日、彭祖百忌、每日宜忌、吉神宜趋、凶煞宜忌、吉神(喜神/福神/财神/阳贵神/阴贵神)方位、胎神方位、冲煞、纳音、星宿、八字、五行、十神、建除十二值星、青龙名堂等十二神、黄道日及吉凶等。

原创 vue 项目源码映射失败问题解决

vue 项目调试源码映射失效问题解决、开发者工具内代码乱码问题解决

原创 微信小程序上传文件（可传 word、excel、ppt、视频、图片……）

近期做技术调研时发现微信官方支持文件上传了，这里记录一下

原创 vue 分段进度条组件

可随意指定刻度数与百分比的进度条

原创 echarts5.x 词云图使用（`[ECharts] Unkown series wordCloud`）

echarts5.x + wordcloud2.x 搭配使用

原创 悲惨经历：浙政钉 iPhone 手机访问页面空白，刷新后正常显示 问题排查（安卓、手机一切正常）

现象如标题所讲，很诡异，到了客户现场先分析环境情况、问题可能出现的原因（页面是前端实习生写的，但这种诡异问题也就只能交由老同志来解决啦……）

转载 深入中英文的排版与换行

关于 CSS 中英文排版与换行的一些探讨（来源于 张鑫旭 B站发布的视频）

原创 element-ui form 表单字段报错错误原因分析

一个页面上有很多表单，而渲染的表单是根据类型字段来的，不是这个类型对应字段就不会有值，设置默认值之后就不会报错了（如果是 厂房租赁 类型，则展示 厂房租赁 的表单，如果是 讲解预约服务 类型，则展示 讲解预约服务 的表单，其他表单隐藏）...

原创 在有限高度容器内使 动态输入框自动滚动到视野内

有限高度内动态添加子项自动滚动到视野内

原创 小程序在开发者工具、真机测试时好好的，体验版 页面空白无法通过审核

原创 结合 `pointer-events:none` 实现多悬浮按钮快速布局

在开发地图相关的应用时，基本都会有按钮要浮在地图之上这种情况，按钮可能有一个，也可能有多个那如何让元素方便的定位且在间隔的地方、空白的地方可以响应地图的拖拽呢？（图片仅说明需求，并不指代微信小程序可以使用上述写法）最常用的就是绝对定位，但如果每个元素都去写绝对定位的话，会很麻烦你需要计算下方的元素的 top 值是多少，如果悬浮按钮的个数不确定，个别悬浮按钮还会根据权限显隐，那么这个问题就会更复杂了又或者如图，要求按钮垂直居中分布，那你计算的 top 值可能就不适用了（当然如果你能想到 :nth-

原创 微信小程序使用分包

文章目录使用分包的配置FAQ主包跳转到分包页面分包使用主包中的文件小程序的包大小限制为 2M，一不小心就超出去了，对于我们开发而言，十分的不方便，就需要我们尽可能的将一些静态资源放到服务器上来减小包大小（一般为图片），但随着第三方框架的引入，业务代码依旧很容易触及小程序的上限，故我们需要采取分包的方式来继续开发参考文章：微信小程序—分包操作、微信小程序分包相关文档目前小程序分包大小有以下限制：整个小程序所有分包大小不超过 20M单个分包/主包大小不能超过 2M使用分包的配置app.j

原创 文字横向自适应宽度并横向排列

如下图左侧图，候选项是后端的数据字典中动态管理的数据，并不能事先知道文本字数，即选项的所占宽度，也就无法直接设定宽度来让文本拥有个比较好的样式，那么想要达到右侧效果图那样的效果该怎么做？可能很多人会考虑从宽度去解决问题，设置固定宽度 width、最小宽度 min-width…但遇到了字数较多等情况，用户体验并不不怎么好，我愣了一会儿，突然意识到，这是宽度不够，导致文本自动换行了，那我用 css 属性设置文本不换行呢？顺带设置个最大宽度，让太长的文本显示省略号，不至于页面样式混乱 /* 设定最大

原创 SVN 检查更改时，代码缩进混乱解决

代码缩进有好几种（tab 键、两个空格、四个空格），我们前端规范大多是要求使用两个空格作为缩进一般情况下我们都是用 tab 键来控制缩进的，然而由于不同人写代码用的工具配置可能不一样，有的人 tab 键是占用四个空格，有的人是两个，或者有的配置干脆在你输入 tab 时，直接就用空格来代替了，所以就出现了在代码编写人本地代码缩进一切正常，到了 svn 上比对代码时缩进乱七八糟的情况…（HTML 结构看的尤为明显头疼）其实 svn 也是可以设置的 tab 代表的空格数的，只需要我们设置一下，它就可以对齐

原创 js 将 list 列表数据按日期分组

js 将 list 列表数据按日期分组前言从后端接口拿到如下数据，想要实现下图效果数据根据日期分组页面样式对于有一定工作经验的前端人员来说肯定不是问题，我们主要来探索如何处理数据格式的问题原数据后端把数据按时间排过序再传给我前端的，故后文我就不对数据进行排序了let data = [ { "userEntity": { "userName": "XXX", "avatar": "https://thirdwx.qlo

原创 前端表单验证交互

文章目录前端表单验证交互效果1（暂未配套代码）使用 vue watch 与自定义 css 模仿 Vuelidate 框架官方表单验证效果代码（仅做思路参考）关于数据校验Vuelidatevalidator.jsVeeValidateVccValidate补充知识前端表单验证交互效果1（暂未配套代码）使用 vue watch 与自定义 css 模仿 Vuelidate 框架官方表单验证效果关键思路：（看了代码就能结合起来了）动态监听输入内容的改变，动态校验其数据的合法性不合法，给元素添加 c

原创 假数据仓库-常见数据枚举（日期、月份、周几、星期几，前导零、①②③……、Excel 列号）

常见数据枚举（日期、月份、周几、星期几，前导零、Excel 列号）日期相关规律数据快速凑出单元格列号（可快速扩展出常见的 excel 列号）拼接原理取得列号

原创 微信小程序预览 word、excel、ppt、pdf 等文件

目录微信小程序预览 word、excel、ppt、pdf 等文件预览效果前言注意点实现代码微信小程序预览 word、excel、ppt、pdf 等文件预览效果前言微信官方提供了相关的 API 来预览常见文件，目前支持如下格式的文件总结一下就是先用 wx.downloadFile API 把文件下载下来，再用 wx.openDocument API 把它打开wx.downloadFi...

原创 微信小程序相关问题排查技巧

遇到微信相关的问题，除了百度，还可以在开放社区搜问题百度出来不行，微信不支持，最好还是在微信开放社区搜一下可能微信近期的版本更新就支持了，而那些文章是在这个新功能之前发表的，或者单纯转载的老文章备注：新出的功能也并不意味着一定要很高的微信版本、手机系统版本，可能要求的还是五六年前的手机系统微信开放社区里提问题也会有联想搜索，点进去看看搞不好就有解决方案(再试着换换关键词搜索...

原创 html 保留空格

如图左侧那一列，竣工类项目没有做地类这个子类，项目经理想要直接空在那里但直接空着，布局会乱掉，即第一行的效果项目经理的预期效果是第二行的，后文介绍下如何实现（个人认为第三行的展现方式看起来更好些）用 <pre></pre> 标签包裹空格即可（无数据时直接渲染空格）参考：CSS 的空格处理&nbsp; 在 HTML 中代表空格<div> <!-- 其他字段 --> <span v-if="!noData"&g

转载 （转载）currentColor 让 CSS 更简短

(转载)currentColor 让 CSS 更简短本文转载自 w3cplus 的 currentColor让CSS更简短(2015-05-08 的文章)文章写的不错，原文转载，未做修改其实currentColor已经出现了有一段时间了，但我是几个月前在阅读Dudley Storey的文章时才听说了currentColor的。Dudley Storey指出currentColor的...

原创 微信小程序 bug-同样的样式代码在 iOS 与 Android 显示效果不同

如下图，左图是 ios 的显示效果，右图是开发者工具的显示效果（Android 效果同开发者工具）问题 css 代码用真机调试节点审查发现元素的高度不对，尝试注释 flex 相关样式，发现问题解决…/* 卡片容器 */.conn_policys .conn_policy_item { /* 冲突代码如下，所幸下面的样式在改版后已经失去了作用，可以直接删除 */ display: flex; flex-direction: column; /* box-sizing: borde