- 博客(51)
- 收藏
- 关注
RSS订阅
原创 vue3使用vis绘制甘特图制作timeline可拖动时间轴，时间轴中文化
vue3使用vis绘制甘特图制作timeline可拖动时间轴，时间轴中文化，并实现原始图、撤销功能
2023-02-13 15:16:39
3018
5
原创 Mapbox Style 规范
Mapbox致力于打造全球最漂亮的个性化地图。Web 端 API Mapbox GL JS 的地图样式规范 Style 的各个配置项。
2023-02-13 11:05:27
652
原创 elementUI给指定日期添加样式，elementUI的cellClassName参数
elementUI可以通过cellClassName属性达到给某些日期添加样式
2022-07-15 10:07:33
3375
8
原创 字蛛（font-spider）教学——ttf/otf字体文件压缩
win+R打开cmd命令窗口，全局安装font-spider：查看版本号，查看自己安装是否成功：第二步、准备好文件夹在项目外的地方准备一个空文件夹，空文件夹里放进一个html文件（或一个html文件和一个css文件），和完整字体文件文件目录结构如下：或css部分可以写在css文件中，也可以直接写在html文件内第四步、压缩在html所在的目录执行命令：运行结束后，目录结构将变成：.font-spider文件夹里放的是原来的完整的字体文件myFont就是提取后的文件注：如果二次使用，
2022-06-07 09:10:25
5470
14
原创 uniapp使用uview实现弹出键盘输入密码/验证码功能
文章目录（一）效果图（二）使用组件说明（三）HTML代码及涉及到的属性解释keyboard属性：keyboard事件：MessageInput属性：MessageInput事件：（四）css样式（五）js代码实现数据：事件：（一）效果图（二）使用组件说明组件使用的是uview组件，Keyboard 键盘和MessageInput 验证码输入两个组件配合使用。uview官方文档：Keyboard 键盘：https://v1.uviewui.com/components/keyboard.html
2021-12-26 17:35:12
7691
原创 uni-app自定义导航栏实现中间凸起效果
效果图主要实现的是：点击中间图标后中间图标凸起的样式，找了很多插件都没法实现，于是自己封装了个组件。点击中间图标前：点击中间图标后：封装组件在components文件夹中新建一个tabbar.vue文件html代码：图片和文字样式是用三元运算符，通过判断选中的下标是否是当前下标来改变样式<template> <view class="tabbar"> <view class="tarbar-list"> <view class="ba
2021-12-22 17:57:34
5935
5
原创 微信小程序wx.getBackgroundAudioManager()背景音频播放
显现的功能：开始播放、暂停播放、停止播放、进度条显示（没有做拖拽进度条）效果播放状态是个动图（图是网上随便找的，如侵删）暂停状态是静态图片：app.json设置首先要在app.json里设置："requiredBackgroundModes":["audio","backgroundAudioManager"]目的是使播放器可以息屏播放。wxml页面显示设置 <view class="spotAudio"> <image src="https://
2021-12-16 12:34:30
5375
原创 微信小程序自定义导航栏样式
修改导航栏为自定义首先明确一下导航栏样式navigationStyle的属性：default默认样式custom自定义样式打开app.json或者当前页面的json文件，设置navigationStyle导航栏样式为custom， 自定义导航栏，只保留右上角胶囊按钮。"navigationStyle": "custom",设置导航样式在自定义页面的wxml和wxss页面中设置样式，样式中要注意定位：position: fixed;z-index: 1;固定的距离顶端的距离在下面获取
2021-12-10 16:22:08
3731
1
原创 Angular兄弟组件之间使用rxjs的Observable发布订阅者模式进行交互
Angular兄弟组件之间使用rxjs的Observable发布订阅者模式进行交互。
2024-03-11 15:34:59
333
原创 angular使用 RxJS 中的switchMap和takeUntil实现接口防抖操作
angular使用 RxJS 中的switchMap和takeUntil实现接口防抖操作。
2023-12-01 18:29:30
575
原创 利用Promise判断请求图片超时，Promise.race
Promise的all方法和race方法提供了并行执行异步操作的能力，并且在所有异步操作执行完后才执行回调。
2023-02-06 17:27:09
242
原创 【pc与移动端适配小tip】使用scss做vh，vw单位适配，scss的mixin与function方法
使用scss做vh，vw单位适配，scss的mixin与function方法
2022-06-23 10:59:58
477
原创 Echarts柱状图横向展示，左侧类名区别显示，自定义tooltip效果
文章目录效果图具体代码及讲解准备数据配置颜色项，方便后续使用图表具体实现效果图一般状态显示：鼠标悬停时效果：具体代码及讲解准备数据var valdata = [10, 15, 25, 55]var titlename = [ '高风险', '中风险', '较低风险', '低风险']配置颜色项，方便后续使用var yhColor = [ new echarts.graphic.LinearGradient(0, 0, 1, 0, [
2022-05-24 16:34:26
1163
原创 Echarts图表柱状图数据最大值显示不同颜色，柱状图渐变色，柱状图显示背景阴影
注：图表其它配置项省略效果图：实现效果：1.数据的最高值显示不同的颜色2.数据展示为渐变色3.显示数据的背景阴影实现代码（仅series配置项）'series': [ //表格中展示颜色的配置项 { name: '', type: 'bar', barWidth: '18',//柱体宽度 itemStyle: { normal: { .
2022-05-24 15:57:56
3836
2
原创 [antd]渲染表单错误：Warning: You cannot set a form field before rendering a field associated with...
问题描述在使用ant Design的表单组件时，使用this.props.form.setFieldsValue方法来渲染表单中的数据时，遇到报错：Warning: You cannot set a form field before rendering a field associated with the value. ant desgin pro form原来的代码：this.props.form.setFieldsValue({ code: code})出现问题：在呈现与值相关联
2022-04-26 18:20:15
1011
原创 react输入框银行卡分段输入显示
显示样式：每四位数字中间显示空格。如图：代码：<input onChange={this.test} />test = (e) => {e.target.value = e.target.value.replace(/\s/g, '').replace(/(\d{4})/g, '$1 ').replace(/\s*$/, '')}
2022-04-24 16:51:25
1428
原创 css的content 属性实现 css 计数器（伪元素与content实现）
这里写目录标题伪元素与content简介什么是伪元素？伪元素的语法：CSS - ::after 伪元素CSS - ::before 伪元素content的作用css计数器相关属性1.counter-reset2.counter-increment3. counter()/counters()计数器示例伪元素与content简介什么是伪元素？CSS 伪元素用于设置元素指定部分的样式。例如，它可用于：设置元素的首字母、首行的样式在元素的内容之前或之后插入内容伪元素的语法：selector::ps
2022-03-01 09:31:58
242
原创 js中的reduce（）方法
reduce（）方法一、语法二、实例1. 求数组项之和2. 求数组项最大值3. 数组去重一、语法arr.reduce(function(prev,cur,index,arr){ ...}, init);其中：arr 表示原数组（必填）；prev 表示上一次调用回调时的返回值，或者初始值 init（必填）;cur 表示当前正在处理的数组元素；index 表示当前正在处理的数组元素的索引，若提供 init 值，则索引为0，否则索引为1；init 表示初始值。二、实例先提供一个原始数组：
2022-02-25 09:45:24
352
原创 保留PC端hover样式，取消移动端hover样式
问题：在pc端hover样式是鼠标悬浮显示，不悬浮就消失；在移动端，hover样式点击后显示，此后如果我们不做处理，那么hover样式就一直存在。解决方法：判断设备是否具备hover事件，决定是否显示hover样式：@media (any-hover: hover) { a:hover { background: yellow; }}这样写就只有支持hover的才会显示hover样式。...
2022-02-21 15:19:46
2184
原创 Foo = Foo||Bar ，这行代码是什么意思？为什么要这样写？
这种写法称为短路表达式解析：相当于var foo;if (foo) { foo = foo;} else { foo = bar;}常用于函数参数的空判断
2022-02-08 16:05:04
850
原创 HTML的label标签运用：点击表单前的文字时，输入框获取焦点
实现效果：点击账号两个字，input框可以获取焦点具体实现：label标签中用for属性，绑定input框的id：<label for="demo">账号：</label><input type="text" id="demo" placeholder="请输入账号"/>
2022-01-16 17:12:15
760
原创 关于vue2什么时候用普通函数与箭头函数的小tips
普通函数所有被Vue管理的函数，最好写成普通函数，这样this的指向才是vm或组件实例对象。例如：methods中的事件函数、computed计算属性简写等箭头函数所有不被Vue所管理的函数，最好写成箭头函数，这样this的指向才是vm或组件实例对象。例如:定时器的回调函数、ajax的回调函数等...
2022-01-14 16:34:41
727
原创 JS获取当前时间的年、月、日、时间
记录一下：var date = new Date();date .getYear(); //获取当前年份(2位)date .getFullYear(); //获取完整的年份(4位)date .getMonth(); //获取当前月份(0-11,0代表1月)date .getDate(); //获取当前日(1-31)date .getDay(); //获取当前星期X(0-6,0代表星期天)date .getTime(); //获取当前时间(从1970.1.1开始的毫秒数)date
2022-01-11 16:26:31
2250
原创 js将字符串中的‘/‘符号替换为‘-‘符号
在涉及到日期的一下地方需要将’/‘符号与’-'符号来回替换，'/‘符号替换为’-'符号：var date = new Date();console.log(date.toLocaleDateString().replace(/\//g, "-"));
2022-01-11 09:25:50
5175
1
原创 CSS设置文本溢出显示为省略号
单行溢出使用text-overflow属性，并且要加width宽度属性overflow: hidden;text-overflow:ellipsis;white-space: nowrap;多行溢出WebKit内核和移动端的浏览器，使用CSS扩展属性display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;//显示的行数overflow: hidden;...
2021-12-28 13:38:51
221
原创 关闭uniapp提示：[sitemap 索引情况提示] 根据 sitemap 的规则[0]，当前页面 [pages/index/index] 将被索引
提示如图(之前一直是将被索引，不清楚为什么这个项目是不被索引，知道是为什么了再来补充，不影响使用)修改配置找到project.config.json文件，在setting下修改/添加"checkSiteMap": false
2021-12-28 13:36:04
740
原创 CSS中的font-family字体集，附在chrome浏览器中的效果图
windows在chrome浏览器中的效果图：宋体 SimSun黑体 SimHei微软雅黑 Microsoft YaHei微软正黑体 Microsoft JhengHei新宋体 NSimSun新细明体 PMingLiU细明体 MingLiU标楷体 DFKai-SB仿宋 FangSong楷体 KaiTi仿宋_GB2312 FangSong_GB2312楷体_GB2312 KaiTi_GB2312Mac OS在chrome浏览器中的效果图：华文细黑：STHeiti Light
2021-12-24 09:00:14
2432
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人