- 博客(30)
- 收藏
- 关注
RSS订阅原创 关于使用 postman 设置全局 token 在请求时自动添加至请求头
如何在每次请求的时候自己携带 `token` ，不需要自己再在每一个请求头中写上token？如何将请求根路径在 `postman` 中一处配置，处处使用？
2022-08-16 13:37:49
5875
原创 关于前端如何通过 JS 读取本地图片并预览在页面中
<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document<
2022-05-30 09:41:41
5349
原创 Refused to apply style from ‘XXX‘ because its MIME type (‘text/html‘) is not a supported stylesheet
完整报错信息是 Refused to apply style from 'http://localhost:8080/src/assets//css/reset.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled问题就是这个文件的类型不是一个受支持的样式表，无法应用样式。在 vue 项目中，在 src 的 assets 目
2022-05-20 09:24:51
19752
原创 关于 js 数组遍历的几种方式
1. for 循环for (let i = 0; i < arr.length; i++) { console.log(arr[i]);}// i ：数组的索引// 0 ：遍历初始位置(索引)// arr ：遍历的数组// i < arr.length ：遍历的条件,满足该条件执行遍历,否则结束// i++ ：每执行一次后执行的代码// 耗时 1.61 mslet ary = new Array(1000000)console.time()for (let i = 1;
2022-05-17 17:21:14
219
原创 关于如何在 vue 中使用 js 数据和方法 export、export default、module.exports
export在 js 中export function test1Fn1() { let list = [ { id: 1, name: "1111", }, { id: 2, name: "2222", }, { id: 3, name: "3333", }, ]; return list;}export function test1Fn2() { let lis
2022-05-17 14:36:56
3597
原创 关于 JS 中，实现在异步代码执行完毕再执行后续代码
因为 js 是单线程，所有的同步任务要等前一个任务执行完毕，再执行下一个任务。function fn1() { console.log("fn1") fn2() fn3()}function fn2() { console.time() for (let i = 0; i < 1000; i++) { console.log("fn2 repeat"); } console.timeEnd()}function fn3() { console.log("fn3")}
2022-05-11 14:48:59
19704
原创 关于前端实现平方等上下角标的方法
方法一：直接复制法m² m³ m⁴ m⁵ mⁿm⁰¹²³⁴⁵⁶⁷⁸⁹详情参考方法二：标签法<div>m<sup>2</sup></div><div>m<sup>3</sup></div><div>m<sup>0123456789</sup></div><div>x<sub>2</sub></div>
2021-09-23 15:41:06
2990
原创 关于前端如何用原生实现刻度尺
刻度线主要通过 background中的 linear-gradient来实现，以为在demo中使用了一部分cm，mm做单位，可能存在误差先上代码：<div class="ruler"> <div class="scal-line"> <div class="exactly-ten"></div> <div class="scal-txt" id="txt"></div> </div></div&g.
2021-09-13 16:26:57
2222
原创 关于用 CSS 实现优惠券样式，内凹圆角及虚线处颜色透明
关于一些边线波浪线的使用，可以参考这篇文章。<div class="coupon"> <div class="left"> <div class="left-wave"></div> 优惠券 </div> <div class="mid"> <div class="top-radius"></div> <div class="mid-left"></div> ..
2021-09-09 16:03:40
1442
原创 关于如何用 CSS 实现不同类型波浪线
1. 样式一<div class="box"> <div class="wave"></div></div>.box { position: relative; width: 800px; height: 30px; margin: 100px auto; background-color: #0f0;}.wave { position: absolute; left: 0; top: -5px; width: 100%;
2021-09-09 15:57:04
1768
原创 关于 vscode 如何自定义初始化代码片段
在使用vscode编辑html文件的时候，只需要输入一个!号就会出现初始化后的一段代码，敲击回车或者tab键之后，便会出现在页面中。有时候 我们需要在固定的配置其他的一些东西，每次敲击会很繁琐。或者其他文件的时候，也想有一套自己的自定义的代码片段。首先打开vscode的设置，在设置里点击“用户片段代码”出现这个页面，你就可以输入你想要设置的文件后缀，例如输入html或者vue先看格式{ "VUE demo": { "prefix": "vue", // 这个是你输入的快捷代码 "
2021-08-25 16:47:35
1718
原创 关于 vue 中 computed 和 watch 的使用
在vue项目中，虽然数据是实时变化的，但当某一个数据是根据其他数据的改变而改变，或这当某一个数据改变时，需要作出其他操作，这时候我们就需要用到computed 和watch。1.computed 计算属性
2021-08-25 16:16:38
433
原创 关于 CSS 如何实现文字溢出隐藏时，隐藏左边而不是右边
通常指定一个盒子给定宽高，当文字溢出，会换行显示出来。.box { width: 60px; height: 30px; background-color: #ff000020;}当限制文字不换行后，会在一行超出显示出来。.box { width: 168px; height: 30px; background-color: #ff000020; white-space: nowrap;}添加溢出隐藏，则会自动隐藏右侧文字.box { width: 168px;
2021-08-16 14:44:25
1933
4
原创 关于如何使用原生实现表格固定列，纯 CSS 实现
在使用 HTML 的表格标签时，当表格项过多时，左右拉动时，希望固定几列不随水平滚动条滚动，表头也不随竖直方向滚动而滚动。在使用组件库的时候，通常都有成熟的API。思路一： 是在查找资料中发现的，创建多个 table 将首尾需要固定的列使用单独的表格，然后对需要固定的列所在表格添加position: absolute，本人想通过一个表格实现，未使用该方法。思路二： 通过position: sticky 实现...
2021-08-13 16:04:06
1598
1
原创 关于当鼠标悬浮时如何修改文字内容，即通过 css 样式切换文字内容
用JS或CSS如何修改网页的文本内容？纯CSS实现鼠标放上去改变文字内容.remind span {display:block;margin-top:-22px;}.remind a:hover {padding-top:22px;}.remind a {float:left;overflow:hidden;}.remind{height:22px;line-height:22px;overflow:hidden;padding-left:10px;}如需修改帐号，请发送修改信息及相关证明至邮箱
2021-08-13 13:54:52
7439
原创 关于如何在 vue 中引入和使用 js 中的数据
有时候当一个数组或者对象比较大，且放在了前端，如果将数据放在vue中的data中，就会显得很多。且不方便以后维护，可以当都将这个数据项放在一个js文件中。这是 js 中的代码，将数据封装在一个函数里面export function dataInJs() { var user = [ { id: 1, }, { id: 2, }, { id: 3, }, { id: 4, }, { id: 5, }, { id: 6,
2021-06-29 13:18:22
13462
原创 关于如何使用 Git 别名简化 Git 操作命令
对于前端程序员来说，git 时管理项目时经常使用的一个工具。平时经常需要查看状态，查看分支，切换分支等各种操作，虽然大多数命令都不是很长，单词也不难拼写，但能简化一点是一点。方法一：通过命令简化git config --global alias.简化后的命令 需简化的原命令举例 ：查看状态 git status 是我们经常使用的一个命令，简化后，我可以使用 git st 代替 git status，也可以通过 git s 代替 git status打开 git 然后运行 git config
2021-06-25 15:16:40
828
1
原创 关于 vue 如何在beforeRouteEnter中获取 this 和操作 data 中的数据
在 vue 项目中，经常需要通过判断从不同的路由进入，显示不同的内容，beforeRouteEnter非常好判断从哪个路由进去，但在这里面因为获取不到this，操作不了 data 中的数据，即使我们知道是从哪个路由进入，也没法对他进行差异化的操作。在官方文档中，beforeRouteEnter 在渲染该组件的对应路由被 confirm 前调用不能获取组件实例 ‘this’...
2021-06-24 10:41:45
12370
5
原创 关于 input 如何对输入框进行限制数字，小数点，及小数点后数字个数等问题
如何在限制 input 只能输入数字和小数点，如何限制只能输入一个小数点，如何限制小数点后小数的个数，如何限制数字的大小等
2021-06-10 13:55:24
29940
9
原创 关于如何在 js 中操作 css 动画的问题，即动态修改 css 动画
方法一：js 操作animationcss 中使用动画，会先定义一个@keyframes 在@keyframes里指定 css 样式，动画将在特定事件内逐渐从当前样式更改为新样式。css 使用动画第一步：定义动画变化的样式@keyframes example { from {background-color: red;} to {background-color: yellow;}}@keyframes test { 0% {background-color: red;} 100
2021-06-10 10:22:00
8110
2
原创 JS 通过日期判断当前日期所在周的周一到周日的日期
例如今天是2021年6月1日，周二，6月1日所在周为：周一2021-5-31 ~ 周日2021-6-6。方法一： let date = new Date(); let currYear = date.getFullYear(); let currMonth = date.getMonth(); let currWeekDay = date.getDate(); let currDate = date.getDay(); let weekStartDate = new Date( currY
2021-06-02 10:00:29
2567
原创 关于H5移动端视频的一些问题，自动播放，添加音频，视频全屏
H5前端如何实现移动端音频视频自动播放项目介绍 vue 前后端 分离 有 android 和 iOS 是所涉及法是否为什么不能 自动播放非静音条件下怎么实现1 通过事件点击(不是用户第一次点击 被禁止了),视频没有播放 就一直 循环触发2 默认禁音 然后 先触发播放, 再在 播放之后操作类样式删除muted属性3 ios 和 android 协助 打开一下开关, 然后 调用android ios方法, 在该方法中 调用自己的事件4 模拟 用户的 点击事件 而不是 自己 通过事件点击5 诱
2021-03-26 14:21:14
1560
原创 关于CSS 的 box-shadow 的个人理解，及如何实现给盒子四周添加上阴影即环形圆形阴影，以及只给盒子一边添加阴影即单边阴影
CSS 中的 box-shadow 用来为盒子添加阴影先看一下官方文档的描述：语法：box-shadow: h-shadow v-shadow blur spread color inset;注释：box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。值描述h-shadow必需。水平阴影的位置。允许负值。v-shadow必需。垂直阴影的位置。允许负值
2021-03-26 14:17:12
5562
1
原创 vue项目中如何禁止移动端页面滚动
通过监听 touchmove 事件：当手指在屏幕上滑动的时候连续地触发。在这个事件发生期间，调用preventDefault()事件可以阻止滚动。// 禁止页面滚动var forbidScroll = function(e) { e.preventDefault();};// 通过 $once 来监听生命周期 beforeDestroy 钩子this.$once("hook:beforeDestroy", () => { window.removeEventListener("touch
2021-03-19 14:14:13
1397
原创 关于vant组件中van-progress的Invalid prop: custom validator check failed for prop “percentage“报错
在 vue 移动端项目中使用 vant 组件中的进度条 出现如下报错虽然在使用中并未发现影响，且进入条也会正常步进。为了解决这个报错，可以在<van-progress></van-progress> 中添加一个判断条件控制该元素的显示与隐藏，来解决报错的问题。v-if="!isNaN(parseInt(percentage))"添加之后将不再报错。<van-progress :percentage="currentPercentage" v-if="!is
2021-03-18 10:09:39
1329
1
原创 关于解决移动端息屏后定时器不工作的问题
不管是Android还是iOS都存在息屏后，过了一段时间后定时器会停止工作，再次打开后才继续工作的问题，且息屏后多长时间定时器会停止工作不确定。本回答只提供息屏后，定时器停止，而软件未被后台杀死的情况。问题描述及需求我们项目是一款运动型软件，定时器记录用户运动的时间，当用户进行跑步等有氧运动时，会进行息屏等操作。而定时器会在息屏一段时间后自动停止（可能是20秒可能是1分钟，也可能是5分钟），只有当再次打开时才会继续计时。思路通过监听 visibilitychange 事件，得知该页面是否为可见。
2021-02-25 14:05:17
3916
原创 关于Chrome浏览器vue devtools F12后控制台不显示VUE选项的问题
在安装完Vue.js devtools后，打开自己写的vue网页，发现右上角vue图标是灰色，而且通过F12打开控制台也没有Vue这个选项。通过上网查询：提到最多的是打开Vue扩展程序，打开无痕模式（隐私模式）下启用，和允许访问文件网址，这两项。对于自己的还是没有用，鼠标左键点击Vue图标（扩展程序已将Vue固定到了页面）会出现提示类文字。情况一：Vue.js not detected ，Vue图标是灰色，这种情况通常可以通过上面那个方法解决。情况二：Vue图标是高亮的，但是控制台没有Vu
2020-10-16 21:15:38
16572
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人