![](https://img-blog.csdnimg.cn/20201014180756927.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端速成
小张很嚣张~
Web前端开发交流,各位大神多多指教~
展开
-
H5页面safari浏览器底部遮挡问题解决方案亲测有效
H5页面safari浏览器底部遮挡问题解决方案亲测有效原创 2023-09-11 18:16:46 · 1351 阅读 · 0 评论 -
border-image和border-radius一起使用border-radius不起作用
解决方案:最外层父盒子假如叫A添加 background为border-image的值,以及添加 boder-radius。关于border-image和border-radius一起使用border-radius不起作用。再添加一层父盒子假如叫B 添加padding值为border的宽度。最外层父盒子的border-radius设置稍大一点效果会更好!最终表现效果是 .tab_box设置的border-radius。C和D都是子盒子 单独设置其border-radius。原创 2023-09-06 16:16:29 · 1505 阅读 · 0 评论 -
三分钟搭建个人博客技术栈Nuxt3+vite+mysql+koa2
最近也是想入一下Nuxt3的坑,然后就写了一个博客系统,目前已开源github,欢迎大家star!!!原创 2023-04-11 14:35:03 · 859 阅读 · 1 评论 -
为什么视频网站的视频链接地址是blob
自从HTML5提供了video标签,在网页中播放视频已经变成一个非常简单的事,只要一个video标签,src属性设置为视频的地址就完事了。由于src指向真实的视频网络地址,在早期一般网站资源文件不怎么通过referer设置防盗链,当我们拿到视频的地址后可以随意的下载或使用(每次放假回家,就会有亲戚找我帮忙从一些视频网站上下东西)。Tips:目前的云存储服务商大部分都支持referer防盗链。转载 2022-11-09 13:34:39 · 1939 阅读 · 0 评论 -
H5兼容性问题汇总
android在软键盘弹起或收起时,会改变window的高度,因此监听window的onresize事件;(1)、在ios中软键盘弹起时,仅会引起body的scrollTop值改变,可以通过输入框的获取焦点情况来做判断。⚠️ ios系统弹起软键盘时,固定定位失效,这是所有ios系统的一个bug,出现此问题时就利用上面监听输入框获取焦点和失去焦点的方法改变样式。html 或者body添加 {-webkit-tap-highlight-color: rgba(0, 0, 0, 0);//兼容firebox。原创 2022-11-04 15:17:16 · 1369 阅读 · 0 评论 -
开发过程中问题收集
因为hook先执行return中的dom渲染,if判断时全都是初始状态的值,如果这些值是异步获取的,并且useEffect中的代码触发时机是Dom渲染后,从而导致错误。hook书写 return的dom结构不要被if语句判断包裹 除非判断的值不是异步状态获取的 如图。tab切换时,跳转最好replace路由,提高用户返回时的用户体验~原创 2022-11-01 17:50:01 · 77 阅读 · 0 评论 -
前端异常数据抓取和数据上报及用户行为信息分析
接口错误异常 统一在 axios封装中 拦截器中使用 .catch 中捕获js异常使用window.addEventListene(‘error’,(error) => {},true);第三个参数表示是否捕获阶段执行,开启捕获不仅可以获取到js的异常,还可以获取到资源加载的异常(如图片加载失败)未处理的 Promise 异常// 打印异常原因// 阻止控制台打印});原创 2022-10-26 11:44:53 · 817 阅读 · 0 评论 -
gitlab-ci.yml 前端node环境文件
script:- node -v- npm -vcache:paths:job build:script:cache:paths:artifacts:paths:- build/原创 2022-09-23 10:54:04 · 630 阅读 · 0 评论 -
移动端瀑布流图文展示React
瀑布流移动端丝滑体验React。原创 2022-09-13 14:10:15 · 903 阅读 · 0 评论 -
electorn读取本地视频资源
electorn读取本地视频资源原创 2022-08-18 18:24:20 · 668 阅读 · 0 评论 -
React中添加防抖
React中添加防抖。原创 2022-07-29 16:34:15 · 253 阅读 · 0 评论 -
前端你需要了解的移动端布局方案
npm i lib-flexible --savenpm install postcss-pxtorem@5.1.1//px转化成rem得配置然后在找到根目录下得.postcssrc.js2. postcss-px-to-viewport 推荐在项目根目录下添加.postcssrc.js文件原创 2022-07-15 16:27:39 · 118 阅读 · 0 评论 -
前端开发进阶之路视频大全
我曾经一度很迷茫,在学了 Vue、React 的实战开发和应用以后,好像遇到了一些瓶颈,不知道该怎样继续深入下去。相信这也是很多一两年经验的前端工程师所遇到共同问题,这篇文章,笔者想结合自己的一些成长经历整理出一些路线,帮助各位初中级前端工程师少走一些弯路。这篇文章会提到非常非常多的学习路线和链接,如果你还在初中级的阶段,不必太焦虑,可以把这篇文章作为一个进阶的路线图,在未来的时日里朝着这个方向努力就好。我也并不是说这篇文章是进阶高级工程师的唯一一条路线,如果你在业务上做的精进,亦或是能在沟通上八面玲珑原创 2022-07-08 16:38:56 · 145 阅读 · 0 评论 -
vue3 中使用store时这么写可以提升效率
vue3中store中的数据获取或者设置 写法如下 非常方便原创 2022-06-01 12:00:04 · 1033 阅读 · 0 评论 -
elementPlus修改主题色以及皮肤设置思路
系统皮肤通过提前定义好各种皮肤风格通过vue的store以及localStorage去动态修改同时代码中要使用变量方式引入store中的主题颜色原创 2022-06-01 11:52:59 · 4089 阅读 · 2 评论 -
小程序自定义custom-tar-bar
<!--miniprogram/custom-tab-bar/index.wxml--><cover-image class="background-bottom {{isIphoneX?'phone':''}}" src="/image/tab/tab_bgc_shadow.png"></cover-image><cover-view wx:if="{{isIphoneX}}" class="tab-bar-backgrond"></cover原创 2022-04-12 14:48:49 · 296 阅读 · 1 评论 -
小程序bindblur遇到的一个坑
因为 this.setData 是异步的所以 input输入后 bindblur 去重新赋值 这个过程中 会出现bugbindblur 的优先级太低了且setData是异步的 这个时候点击确认按钮 打印 input框内的值会发现 是之前的值解决方案1. 不要用bindblur 使用bindinput解决方案2. 确认按钮添加 setTimeout 防止确认的动作比离do焦的快动作...原创 2022-02-09 16:19:33 · 1818 阅读 · 0 评论 -
前端工程化-文件集中注册
import { createStore } from 'vuex'const path = require('path')const requireModules = require.context('./modules', true, /index\.(ts|js)$/iu)const modules = {}requireModules.keys().forEach(filePath => { const modular = requireModules(filePath).原创 2022-01-18 11:13:31 · 476 阅读 · 2 评论 -
商城小程序仿每日饭粒打造属于自己的商城小程序
原创 2022-01-10 10:06:45 · 144 阅读 · 0 评论 -
css和js小案例
下载地址原创 2021-07-19 09:43:18 · 116 阅读 · 0 评论 -
OSI七层网络模型前端面试题
OSI七层网络模型包括:物理层、数据链路层、网络层、 传输层、会话层、表示层、应用层。如何理解?物理层对应的物理实体就是网线,水晶头. 数据链路层对应的物理实体就是交换机, 网络层对应的是路由器.想象一个数据包从一个主机发送出来, 经过网线水晶头(物理层), 再经过交换机(数据链路层), 然后通过路由器(网络层), 到达另一个主机. 之后,这个数据包将离开物理硬件, 完全进入到软件的范畴了. 这个包是是用tcp或者udp来进行传输(传输层), 然后两个主机开始建立会话并管理会话(会话层), 然后解原创 2021-05-18 11:00:06 · 506 阅读 · 0 评论 -
前端基础速成day04--外边距and选择器
day04一、外边距作用:移动盒子位置 设置盒子与盒子之间的距离margin:10px;上下左右 10pxmargin:10px 20px;10px上下 20px左右margin:10px 20px 30px;10px上 20px左右 30px下margin:10px 20px 30px 40px;顺时针 上右下左margin-left:+npx ;盒子会右侧移动 -npx 盒子会左侧移动margin-top:+npx盒子会下侧移动 -npx盒子会上侧移动margin-right原创 2020-11-30 12:57:31 · 273 阅读 · 0 评论 -
前端基础速成day03--文本属性and盒模型介绍
day03回顾:二维数据展示标签 表格宽度高度自适应 <table> <tr> <td> div>a>img+p </td> </tr></table>自带属性:border="1px"align:bgcolor:width:height:cellpaddin原创 2020-11-30 12:56:11 · 175 阅读 · 0 评论 -
前端基础速成day02--tabel的相关属性
day02回顾:文本类型:h p i/em strong hr br u /ins b/strong s/delh1一般用在logo 盒子布局类型: div, span, 列表系列 ul>li ol>li dl>dt+ddul ol dl 直接子代 不能是其他元素ul > li> div功能性: 相对路径: / ./ …/ …/…/alt:title: 鼠标悬停一:功能性标签:超链接功能:跳转网页 、 跳转到某一个网原创 2020-11-30 12:54:45 · 257 阅读 · 0 评论 -
前端基础速成day01--总体介绍
前端发展史前端开发: 用技术实现用户界面(site or app)+ 数据交互技术: HTML+ CSS+ JS +框架拿数据 + 静态界面 ----》 用户界面web1.0 时代 静态 用户只能阅读者 没有交互web2.0 js 交互web3.0 node.js 大前端时代左侧第5个图标 扩展 搜索一下两个插件 右下角 install 安装即可chinese汉化view in broswer 查看关闭 重新打开!!!把 自动保原创 2020-11-30 12:52:34 · 318 阅读 · 0 评论