姜雪辞-CSDN博客

原创仿框架封装功能较为齐全的自定义原生js分页组件（已发布npm包，附源码）

写在前面效果预览直接上代码<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>js</title> <style> .pagingArea { display: flex; flex-direction: row; align-items: center; font-famil

2020-07-30 17:24:32 397

原创记录不同浏览器中，flex布局下图片不保持宽高比的问题以及IE下图片不显示的问题

问题重现我在页面上写了一个img标签，因为想让它的大小跟随浏览器窗口尺寸改变，所以在设置样式的时候，直接让它的宽width为父元素（这里就是整个窗口）的100%，高height因为要保持宽高比，所以设置为auto。<div style="display: flex;"> <img src="1.png" style="width:100%;height:auto"/> </div>而我这个img标签的父元素用了flex布局。写的时候因为用的是chro

2020-07-23 16:09:45 1146 1

原创记录调用window.print时因处理页眉页脚问题导致自动分页后打印不全的解决方法

写在前面这几天朋友项目中还在使用window.print，结果问题它又来了。我写了个demo模拟遇到问题的场景，先看效果：看过我前一篇关于print的文章的小伙伴都很熟悉这个界面吧，上次截的时候就有这个页眉页脚了，但上次他没有提这个地方。这次发现问题了，就来解决一下。言归正传，那想去掉这个其实很简单，只要在浏览器设置中把页眉页脚勾掉就可以了：但还是那句话，你可能给每一个用这个项目的客户说，你要在打印之前去浏览器设置里把页眉页脚勾掉吗？显然是不可能的。所以像上次的背景水印一样，我们还

2020-07-14 16:53:49 3182 1

原创加了！important没用？失效了？记录一个一直被我忽视的关于！important提升权重的问题

情景再现这是我今天写一个小demo时发现的自己一直忽视的问题。先截取一下我的代码片段：<!DOCTYPE html><html><head> <meta charset="utf-8" /> <title>test</title> <style> #box { color: green !important; } .pink-text { color:

2020-07-09 15:44:39 7440 3

原创在不对项目进行大改的情况下解决mpvue默认的px转rpx的问题

写在前面最近在公司接手了一个开发了一半的mpvue项目，在写边框样式的时候，照常给了粗细为1px。但是，当给UI小姐姐看效果的时候，她立马就跟我说，你这个肯定不止1px。我当下就不认可了，我这个写死了1px的，怎么可能不是呢？于是打开开发工具调试给她看，结果，哦豁，还真不是1px，是2rpx。这就奇怪了，我明明写死的1px，怎么调试的时候会变成2rpx呢？于是我推测，mpvue默认有一个px转rpx的方法。全局搜索之后，果然找到了它。路径：“/build/util.js”：就是这个px2rp

2020-07-07 14:54:17 620 2

原创记录移动开发初探——用uniApp+sqlite仿XyKey实现密码管理记事本

写在前面最近刚准备上手移动开发，本着想要多端可用的原则，了解到了uniApp。大致扫完一遍文档，基本可以算是vue+微信小程序原生，对我来说基本0难度可直接进入开发。因此想着索性做一款简单的app来做更加深入的了解。就在这时候，朋友给我推了XyKey这个应用，在使用了一番之后，还是非常有兴趣的，于是打算自己仿XyKey开发一个类似的密码管理记事本。注：我自己开发的这个项目灵感来源于：聊一聊我是怎么设计 XyKey，界面UI设计也是仿照XyKey来的。XyKey可在安卓市场免费下载，苹果商店12元可购买

2020-07-06 16:00:21 1133

原创解决调用window.print时，因页面较长自动分成两页后只有第一页有背景图，第二页没有背景图，以及-webkit-print-color-adjust: exact失效的问题

问题重现为了清晰的看到问题，我新写了一个空白的html，然后对body样式进行了如下设置：①高度2000px②背景图在y轴循环填满整个高度body { height:2000px; background: url("images/noBallFriends.png") repeat-y;}然后调用window.print()打印当前页面，可以看到他是这样子的：由于2000px的高度比较高，这时它会自动分两页去打印，第一页看上去没什么问题，但第二页：没错，背景图没了。怎么回事？我

2020-07-02 14:59:04 3928

原创自己开发封装的微信小程序计算器组件，复制即可用（完整代码）

写在前面我在开发自己用的账本类微信小程序时，因为嫌老是要切屏打开计算器，算完之后还要照着计算结果手动记录很不方便，尤其是当计算出来的结果位数较长时，容易看错或打错，因此想自己开发封装一个计算器组件在需要用的页面里，这样不仅可以减少切屏的次数，还可以直接去拿到计算结果自动记录，非常的方便。按惯例先贴效果再上代码，啰嗦的话后面再讲。效果预览完整代码先贴目录，自己对应下面的代码复制到哪个对应的文件里（后续等我把自己的项目整理差不多了，有空写一个demo放到github上，这样下载起来会更方便一些。现在

2020-07-01 12:21:50 2119 4

原创都在写抖音上的网红罗盘时钟，我也用vue仿写一个

先看效果直接上代码<template> <div class="container"> <div class="dateTimeBox yearBox isActive">{{nowYear}}年</div> <div id="monthArea" ref="monthArea"> <div class="dateTimeBox" ref="monthBox" v-for="(item,index) in

2020-06-29 14:54:46 1981 5

原创获取省市区geoJson数据（精确到县、镇）用于echarts实现地图数据可视化

先看效果：熟悉echarts的看到这个图之后，都想到了什么？没错，就是官方示例里的香港18区人口密度图：从官方示例代码我们可以看到，生成图中各区域地图的，就是引入的这个json文件：那么，如果我们想要生成自己想要的地区地图，只要拿到相应地区的json文件就可以了。这个文件里面主要是什么内容呢？把这个文件地址打出来打开它，我们可以看到，它是geoJson格式的：（这里补一下GeoJson的百科链接，第一次接触的小伙伴可以了解一下：百度百科 - geoJson）因此，我们如果能拿到自己需要的

2020-06-28 11:00:03 22245 45

原创解决调用wx.downLoadFile下载的文件名乱码（长串英文字符）问题

这两天遇到一个需求，将统计数据生成的excel表在小程序中下载。第一次在小程序中碰到下载的需求，一开始想像之前做公众号h5页面一样的方法直接用a标签下载附件，后来想起来小程序不支持a标签。查了一下微信里面下载附件的，是用wx.downLoadFile来实现的。实际操作以后，发现下载下来的附件，文件名是一长串奇怪的英文，并不是像想象中一样可以自定义。这样如果用户保存之后想要找到这个文件，但是下载的文件太多了，名字又都是乱码，一方面不好找，另一方面看起来很乱。但是查看文档之后发现wx.downLoadFil

2020-06-25 07:53:16 4136 3

姜雪辞的博客