前端
关注
分享
扫一扫
survivorsfyh
Do your best to meet the best friend!
展开
-
微信公众号关闭Web页面、底部工具类和右上角三个点状态处理
微信公众号关闭Web页面、底部工具类和右上角三个点状态处理原创 2024-05-14 14:42:07 · 696 阅读 · 0 评论 -
Cannot assign to read only property ‘name‘ of function ‘function Object() { [native code] }‘
Cannot assign to read only property 'name' of function 'function Object() { [native code] }'原创 2024-01-25 16:47:38 · 858 阅读 · 0 评论 -
Expected linebreaks to be ‘CRLF‘ but found ‘LF‘.eslintlinebreak-style
Expected linebreaks to be 'CRLF' but found 'LF'.eslintlinebreak-style原创 2024-01-05 11:33:07 · 675 阅读 · 0 评论 -
自动递增或递减填充生成数组,根据某个数值
根据某个数值自动前后递增或递减填充生成数组原创 2023-06-14 09:53:27 · 324 阅读 · 0 评论 -
‘Elf‘ is not defined. (no-undef). eslint
'xxx' is not defined. (no-undef). eslint原创 2023-05-22 16:54:09 · 280 阅读 · 0 评论 -
cannot redeclare block-scoped variable
cannot redeclare block-scoped variable原创 2023-02-03 17:48:37 · 1556 阅读 · 0 评论 -
cannot be compiled under ‘--isolatedModules‘
cannot be compiled under '--isolatedModules'原创 2023-02-03 16:58:56 · 955 阅读 · 0 评论 -
css中100%与100vh区别
100% 与 100vh 的区别原创 2023-02-03 15:08:29 · 656 阅读 · 0 评论 -
code ELIFECYCLE
code ELIFECYCLE原创 2023-02-01 16:36:01 · 271 阅读 · 0 评论 -
node 操作指令相关
node、nvm 操作指令相关原创 2023-01-29 16:46:27 · 108 阅读 · 0 评论 -
通过 axios 方式下载文件
通过 axios 方式下载文件原创 2022-08-03 09:44:47 · 12485 阅读 · 3 评论 -
通过iframe渲染外部链接地址url视频页面 - Vue
通过 iframe 的方式对外部链接地址的URL页面进行渲染加载以上便是此次分享的全部内容，希望能对大家有所帮助！原创 2022-06-23 10:14:37 · 790 阅读 · 0 评论 -
date.getFullYear is not a function
该方法 date.getFullYear is not a function 仅作用域为时间格式的情况下,提示该异常极大可能是数据的格式与方法不匹配;解决办法事先将需要处理的数据进行格式的转译后再调用时间相关的方法或者在时间转换的公共方法中默认预先转译一次dateFormat(fmt, dateValue) { /* * 日期格式转换 * fmt 将要转换的格式样式 * date 需转换的时间 * con原创 2022-05-10 11:55:29 · 5488 阅读 · 1 评论 -
meta 标签属性相关
<meta> 标签属于HTML文档 head 中的一份子,居于<head>元素的内部,且没有结束标签;该标签提供了很多网页相关的信息,且这些信息都是隐藏的属性;该标签通过一个name属性来设置元数据,而元数据所对应的值则放在content属性里,有点于对象的key/value类似;如下罗列一些日常开发中可能会涉及到的常用属性:一.http-equiv该属性类似于请求的头部,其作用是向浏览器传回相关的信息,例如如下一些较为常用的1.content-type用于声明原创 2021-11-04 17:27:58 · 161 阅读 · 0 评论 -
适配带刘海屏和底部黑的 iPhone 设备
前端页面嵌入到带刘海机型的 iPhone 内后尽管宽高配置了100%后依然会出现上下部分均留黑和上下可滑动的情况出现，通过如下方式可以将其避免，具体操作如下：首先，找到项目中的根目录文件 index.html其次，在 viewport 的 meta 中配置如下属性即可：viewport-fit=cover最后，在正常尺寸的屏幕内是完全 ok 不会受到该影响，若有刘海屏的情况配置后即可，完整 code 如下：<meta name='viewport' content='width=原创 2021-05-08 15:48:20 · 266 阅读 · 0 评论 -
搜索框实现模糊查询方法 - js
日常开发中经常会遇到搜索框查询的例子，需要对数组中的元素进行检索并查询出所需的结果，通过如下方式简单实现了一个小的模糊查询，具体如下：首先，用到了两个方法1.对数组通过 filter 的方式遍历查询搜索的 key2.对遍历出的结果进行字符串的模糊查询 str.indexOf("xxx") != -1其次，通过如上两种方法的组合从而获得一个类似模糊查询的效果；最后，具体实现 code 如下：// listRes:查询结果返回的数组 arr// val:查询搜索的 keyonSearch(原创 2021-03-19 16:40:05 · 3315 阅读 · 0 评论 -
CSS 子级元素固定在父级元素底部 - css
日常开发中经常会遇到类似移动端底部 Tabbar 的效果，将子元素固定在父级元素底部的情况；首先，需要配置子父视图的宽高em: 它是描述相对于应用在当前元素的字体尺寸，所以它也是相对长度单位。一般浏览器字体大小默认为16px，则2em == 32px；ex: 依赖于英文字母小 x 的高度ch: 数字 0 的宽度rem: 根元素（html）的 font-sizevw: viewpoint width，视窗宽度，1vw=视窗宽度的1%vh: viewpoint height，视窗高度，1vh原创 2021-02-20 16:56:00 · 5640 阅读 · 0 评论 -
日期时间格式转换 dateFormat
日常开发中难免会遇到对时间格式处理的问题，如下记录一个转换时间的小方法，具体 code 如下：dateFormat(fmt, date) { /* * 日期格式转换 * fmt 将要转换的格式样式 * date 需转换的时间 * console.log(YHUtility.dateFormat('YYYY-mm-dd HH-MM-SS', object.value)); * */ let ret; const opt = {原创 2021-01-28 11:56:59 · 1290 阅读 · 0 评论 -
数组删除、去重 - JavaScript
日常开发中经常会遇到对数组进行增删的情况发生，简单记录两个小例子，当前使用场景为监测列表的选中与取消记录操作；首先，如下有两种实现方式可供参考，其中运用到了数组的 indexOf()、filter() 和 splice()，具体 code 如下：方式一，通过Array filter() 方法搭配indexOf() 方法的方式：let arr = this.taskIdsArr;if (checked) { arr.push(id); // 数组添加元素 this....原创 2021-01-07 11:46:37 · 134 阅读 · 0 评论 -
去除html标签及空格相关 - Dev
Text 文本加载后经常会遇到带有 html 标签一同渲染的情况，通过对数据源进行 replace 替换的方式即可解决，适用于前端同时也支持 ReactNative 具体方式如下：去除空格、emsp、nbsp、各种<>符号const content = content.replace(/\s/ig, '');const content = content.replace(/ /ig, '');const content = content.replace(/&am原创 2020-09-04 17:04:28 · 232 阅读 · 0 评论 -
html 中几种常用特殊字符 - html
日常开发中对一些特殊字符的处理是很常见的，如下是针对 html 中几种常用特殊字符的一种表达方式字符小结： 即：空格& 即：&"即："&qpos; 即：'< 即：<>即：>以上便是此次分享的全部内容，希望能对大家有所帮助！...原创 2020-06-08 18:30:45 · 1395 阅读 · 0 评论 -
JavaScript entries 方法小试牛刀 - js
新接的项目中遇到了一个很恶心的数据源结构，用到了 JavaScript 的 entries 方法，高效的解决了多层数据遍历的方式，不但性能上有效的提高了很多，还精简了很多冗余的代码 code，特此小结一下；初始数据源样式，key 值为样式中的 section，对应的 value 为具体的 cell 子样式，而页面组件渲染的时候直接取 key 进行 for in 遍历的操作时可以通过 for((item, name, index) in obj) 中的 name 来直接获取 key，但在后期对数据源处理上原创 2020-06-08 17:12:26 · 449 阅读 · 0 评论 -
js 判断对象是否为空 - js
日常开发中对对象类型的数据源进行判空是很常见的操作，对象的判空方式与数组的 length 方式有所差异，如果对象的判空方式依然使用对数组 length 的判空方式是行不通的，以下有几种判空方式可供借鉴：方式一，可以通过for in 循环遍历的方式for(let item in dataList) { if(item) { console.log(item); } else { console.log('空对象'); }}方式二，.原创 2020-06-06 17:29:19 · 203 阅读 · 0 评论 -
js 获取URL参数 - js
日常开发中经常会遇到从 url 中获取参数的情况出现，如下 code 进行简易的封装便于调用；getUrlPrmt(url) { /** * 获取URL参数 * @param url 地址 * @returns 例：getUrlPrmt("http://www.baidu.com?id=1&nam=张三&uid=12345654321&type=1,2,3")，结果{id: "1", nam: "张三", uid: "12345654321",原创 2020-06-01 15:54:28 · 176 阅读 · 0 评论 -
动态绑定 class 的几种实现方式 - Vue
日常开发中难免会遇到动态渲染修改样式的需求出现，So 简单归纳如下三种实现方式，虽然还是学时的时候有所了解但事后很久不在接触，此次重新初识前端不久，哪里可以更优还请大佬多多指教！方式一：通过Class 与 Style 绑定的方式即三目运算的判断方式设置样式，也是 Vue 官方推荐的方式，具体 code 实现如下：html 代码片段<button type="button" :disabled="btnDisabledState" :class="[.原创 2020-05-27 17:04:19 · 663 阅读 · 0 评论 -
前端调试小插件之 vConsole - js
分享一个前端页面嵌入在移动端后调试的小插件，继承简便且便于查找问题，生产环境时直接移除对应的配置 code 即可；在工程目录的 index.html 中添加如下 code 即可：<head> <script src="https://cdn.bootcss.com/vConsole/3.3.0/vconsole.min.js"></script> <script> var vConsole = new VConsole(); <原创 2020-05-19 17:14:28 · 364 阅读 · 0 评论 -
Vue 设置 proxy 代理 - Vue
开发中接口调试经常会遇到接口调试抛出跨域问题，在 vue.config.js 中设置如下 proxy 即可：注：当前 Vue 版本为 @vue/cli 4.3.1// vue.config.js 文件下module.exports = { publicPath : '', devServer : { proxy : { '^/osce2' : { target : 'http://192.168.8.187:8原创 2020-05-19 16:48:19 · 320 阅读 · 0 评论 -
Elements in iteration expect to have 'v-bind:key' directives. - Vue
项目中创建 html 样式的时候，运用到了 v-for="item in listData" 但抛出了如下异常：Elements in iteration expect to have 'v-bind:key' directives.(vue/require-v-for-key)解决办法使用 v-for 的同时需要添加绑定，即 v-bind:key="xxx" 即可。v-for="item in listData" v-bind:key="item"以上便是此次分享的全部内容，.原创 2020-05-13 15:15:24 · 577 阅读 · 0 评论 -
通过 css 将 div 固定在底部 - css
对将要固定至底部的 div 设置如下 class 样式即可：设置基础宽高后并添加绝对位置定位 position 为 fixed 和 bottom 为 0；.footViewStyle { /*底部视图*/ background-color: #F4F5F6; width: 100%; height: 60px; position: fixed; bottom: 0;}以上便是此次分享的全部内容，希望能对大家有所帮助！...原创 2020-05-13 10:47:29 · 9245 阅读 · 0 评论 -
vue.config.js - Vue
通过 Vue Cli 的方式创建项目后，项目打包成功部署后页面加载渲染异常，提示少 config 配置文件，需建立如下 vue.config.js 的 js 文件并将如下 code 编码填入对应的 js 类中重新打包部署即可module.exports = { publicPath: ''};以上便是此次分享的全部内容，希望能对大家有所帮助！...原创 2020-04-26 10:29:04 · 145 阅读 · 0 评论 -
通过 div 的方式实现比 1px 还细的横线 - html
一种较为简易的方式实现横线效果，通过 div 设置边框 border 的方式，具体 code 如下；<div style="width: 25%; border-top: 1px solid #8A8B8C; transform: scaleY(0.4);"></div>以上便是此次分享的全部内容，希望能对大家有所帮助！...原创 2020-04-16 16:02:17 · 883 阅读 · 0 评论 -
位数不足零来补位 - js
在计时器或者倒计时的场景经常会遇到时间位数不足两位的情况，此处需要补位来填补空缺，使得 UI 界面更加舒适美观，直接调用如下方法即可搞定，具体 code 实现如下：export function YHFormatZero(num, len) { // 当前数字位数不足即向数值前面位数补零 /** * 例如： * <Text>{formatZero(数值...原创 2020-03-28 18:16:46 · 813 阅读 · 0 评论 -
通过 js 方式实现原生 html 按钮倒计时功能 - js
日常开发中经常会遇到获取短信验证码倒计时的小功能，此次遇到一个通过 Thymeleaf 模板渲染的方式实现的项目，其页面模板引擎是通过原生 html 方式实现，现今各式各样成熟的组件横飞，突然回顾到原生 html 突然好怀念当初的上学时大家一起埋头做毕设的时候哈哈，故特此小结，具体 code 实现如下：首先，创建按钮并绑定触发事件<input id="msgCode" ...原创 2020-03-09 11:53:46 · 566 阅读 · 0 评论