前端
文章平均质量分 64
前端知识真的多
Z_ One Dream
不扯太复杂的概念,不说太多的废话。
展开
-
使用 yarn,ts 提示 找不到模块“xxx”或其相应的类型声明
找不到模块“xxx”或其相应的类型声明Module "xxx" or its corresponding type declaration could not be found.pnp.cjs .pnp.loader.mjs原创 2023-02-13 12:48:50 · 912 阅读 · 0 评论 -
js 在 ios 上访问 WebViewJavascriptBridge 是 undefined
把下边这串代码执行一下就可以访问 window.WebViewJavascriptBridge 了。但是 ios 访问 WebViewJavascriptBridge 就是 undefined。安卓可以访问 WebViewJavascriptBridge。原创 2022-11-03 17:07:04 · 1204 阅读 · 0 评论 -
sass 骚用笔记
sass 的一些常用写法,知道了这个之后,还怕几百行的 css 吗?原创 2022-09-06 14:45:27 · 219 阅读 · 0 评论 -
‘v-slot‘ directive doesn‘t support any modifier
这个报错是说,v-slot 不支持任何修饰符意思是不让你这样写这个 xxx 就是修饰符它只允许你这样写。原创 2022-08-18 11:28:00 · 1484 阅读 · 0 评论 -
vite 多页面应用刷新页面时,不会在当前路由中,会返回到根路由
vite 多页面应用刷新页面时,不会在当前路由中,会返回到根路由多页面应用刷新问题原创 2022-07-27 17:33:03 · 1093 阅读 · 0 评论 -
一个合约能存储多少数据?
一个智能合约能存储多少数据?智能合约的数据会不会存满?区块链数据会越来越多吗?原创 2022-07-20 12:37:15 · 571 阅读 · 0 评论 -
vue 如何在 style 标签里使用变量(数据)
vue 如何在 style 标签里使用变量(数据)vue 如何在 代码中使用 style 属性vue 如何在 html 中使用 style 属性原创 2022-07-01 16:57:08 · 9895 阅读 · 0 评论 -
元素使用 align-items center 和 overflow auto 之后,部分内容显示不全
当我们为了让内容居中使用了 align-items center 属性之后,因为屏幕小的会遮挡一部分内容我们就会给盒子再加上 overflow-y auto 这个属性但是当我们缩小屏幕时,会发现,内容的上半部分会显示不出来 这是因为元素在侧轴居中。如果元素在侧轴上的高度高于其容器,那么在两个方向上溢出距离相同参考文档:align-items - CSS(层叠样式表) | MDN2. 将 display flex 改为 display grid...原创 2022-06-29 10:26:13 · 3245 阅读 · 4 评论 -
字符串之间的比较之 localeCompare
很多人比较字符串基本上都是用 > 或者 < 比较还有些人使用 localeCompare,但是你真的会用这个 原型方法 吗?这里举个例子来说明一下如何比较 字符串中的数字那么如果我们遇到这种情况,其实 localeCompare 这个方法还提供了很多参数来比较指定数值排序是否应该被使用,像是这样 "1" < "2" < "10"。可能的值是 和 指定是否优先对大写字母或小写字母排序。万能排序,如何比较字符串中的数字......原创 2022-06-20 10:31:07 · 988 阅读 · 0 评论 -
vue 如何用 jsx 语法写?
以 JSX 的方式来编写 Vue 代码JSX 如何绑定 emit 如何在 JSX 语法中用 @ 绑定 emit 方法转载 2022-06-16 14:23:16 · 291 阅读 · 0 评论 -
这些神仙布局方式你还不会?
参考了很多人写的文章,这里做一个汇总clamp() - CSS: Cascading Style Sheets | MDN 其实就是表示 aspect-ratio - CSS: Cascading Style Sheets | MDN CSS 属性为 box 容器规定了一个期待的纵横比,这个纵横比可以用来计算自动尺寸以及为其他布局函数服务。例如:盒子保持一个正方形3. grid 布局 auto-fit 和 auto-fillrepeat() - CSS(层叠样式表) | MDNauto-fit原创 2022-06-14 18:40:00 · 236 阅读 · 0 评论 -
前端项目优化持续记录
结论:如果我们想获取距离父元素顶端的距离的时候,应该尽量采用后三种结论:如果在一个同步代码块需要很多元素查询时,请尽可能换成第二种结论:同样大小的 png 和 svg,svg 要比 png 图片加载的慢一些...原创 2022-06-13 17:26:10 · 183 阅读 · 0 评论 -
BigNumber 的静态属性含义-(ROUND_DOWN,ROUND_UP,ROUND_CEIL,ROUND_FLOOR,ROUND_HALF_UP,ROUND_HALF_CEIL)
BigNumber 有一些静态的属性,代表不同的含义ROUND_DOWN,ROUND_UP,ROUND_CEIL,ROUND_FLOOR,ROUND_HALF_DOWN,ROUND_HALF_UP,ROUND_HALF_CEIL,ROUND_HALF_FLOORROUND_UP 和 ROUND_CEIL 的不同之处ROUND_DOWN 和 ROUND_FLOOR 的不同之处...原创 2022-05-30 17:59:00 · 2102 阅读 · 1 评论 -
tsconfig.json 配置文件说明
官方链接:TypeScript: Documentation - What is a tsconfig.jsonhttps://www.typescriptlang.org/docs/handbook/tsconfig-json.html目录中存在tsconfig.json文件表明该目录是 TypeScript 项目的根目录。该tsconfig.json文件指定编译项目所需的根文件和编译器选项。JavaScript 项目可以使用jsconfig.json文件来代替,它的作用几乎相同,但默认启用了一些原创 2022-05-26 10:10:14 · 656 阅读 · 0 评论 -
通俗易懂地了解 Bloom filter
Bloom filter 的作用就是查找某个元素是否在该集合中比如我们有一个 1000 长度的数组,我们想要查找 "Hello" 字符串是否在这个数组中,那我们就必须要通过循环对比来判断,这样会非常的浪费时间这个问题可以通过 Bloom filter 解决Bloom filter 的特点是:有可能误判但一定不会漏判,换句话说就是查询返回的结果 “可能在集合中” 或 “绝对不在集合中”。...原创 2022-05-18 17:55:12 · 236 阅读 · 0 评论 -
如何设置手机导航栏颜色
1. 根据不同的主题设置颜色,只适用 Android 端部分浏览器,兼容性不是很好<meta name="theme-color" media="(prefers-color-scheme: light)" content="white"><meta name="theme-color" media="(prefers-color-scheme: dark)" content="black">参考:theme-color - HTML(超文本标记语言) | MDN.原创 2022-05-17 15:50:13 · 830 阅读 · 0 评论 -
vite 使用 web3, walletConnect 报错
vite 使用 web3 报错,global is not definevite 使用 walletConnect 报错,global is not definestream is not definebuffer is not defineprocces is not define原创 2022-05-18 18:03:01 · 2634 阅读 · 9 评论 -
去中心化是什么意思,区块链到底是什么
这里记录的文章只适用于完全不懂区块链的人,如果有不懂得地方,下方评论我会给出通俗易懂的回复参考了廖雪峰老师的个人博客,这里我主要是写得更小白一点https://www.liaoxuefeng.com/wiki/1207298049439968/1311929706479649什么是区块链?可以理解为是一个大型的记事账本,和传统账本不一样的地方在于,这个记事账本是由所有参与的人一起记账的,我们拿 某宝 举例子。当我们有一笔交易的时候,某宝就会记录下来这笔交易,比如记录 小明给小花转了100元,然原创 2022-04-28 19:19:42 · 4087 阅读 · 0 评论 -
get 和 post 的区别
getpost对比相对来说 get 是安全的,post 是不安全的,因为 get 的实现是无副作用的,post 一般情况是有副作用的。比如 get 用来获取某些列表数据,每次请求都会返回一样的数据。post 用来提交一项数据,每次请求都会在数据库中增加一列。当然,并不是一定是这样的,因为这种规定是认为的,也就是说,get 是为了无副作用而使用的http 方法,但是你可以用 get 实现删除或者增加的功能。我们来说一下幂等幂等的意思就是同样的请求被执行一次与连续执行多次的效原创 2022-04-24 11:43:24 · 3025 阅读 · 0 评论 -
防抖函数和节流函数
防抖函数顾名思义,防止你手抖不小心点了两次,或者说一直在抖第一种,这段时间内,如果你手抖了,那就只执行一次,比如模糊搜索,人一直在输入function generateDebounce(fn, delay) { let timer let args return function() { args = arguments window.clearTimeout(timer) timer = window.setTimeou原创 2022-04-21 22:09:47 · 274 阅读 · 0 评论 -
HTTP 缓存(web 缓存)
注意:常见的 HTTP 缓存只能存储 GET 响应通过复用以前获取的资源,可以显著提高网站和应用程序的性能Web 缓存减少了请求的等待时间,并且节省了网络流量缓存基本上可以分为两个大类私有缓存(浏览器缓存)公共缓存(代理缓存)私有缓存私有缓存是指只能给单个用户使用的缓存比如用户的基本信息,比如用户请求自己的身份认证信息等等公共缓存公共缓存是指所有用户都可以访问的缓存。我们常常用 nginx 做反向代理,这里我们假设服务器有一个图片是 1.jpg当一万个用户去请求这个图片,ngi原创 2022-04-18 13:38:02 · 617 阅读 · 0 评论 -
关于父元素设置min-height,子元素设置 height 100% 不生效的问题
<div class="container"> <div class="child"></div></div><style> .container { min-height: 100px; border: 1px solid; } .child { height: 50%; background: red; }</style>.原创 2020-10-15 18:43:52 · 12302 阅读 · 4 评论 -
手摸手教你 vue 的依赖收集
const data = { flag: true, firstName: "郑", lastName: "义梦"}const computed = { fullName() { if (!data.flag) return "没有名字" return data.firstName + data.lastName }}我们模拟 vue 的 data 和 computed 属性,现在我们需要实现下边功能当 flag 为 true 的时候,设置 firstN原创 2022-04-16 00:03:50 · 1616 阅读 · 0 评论 -
Esbuild 配置文档
简而言之就是:esbuild是go语言写的,编译速度快,支持的环境多。究竟有多快:它的编译速度是普通编译插件的 100多倍它的API可以通过三种方式访问:命令行、JavaScript和Go,而且文档还是独一份基础命令version构建快速转化APITransform API转换API调用只对单个字符串进行操作,而不访问文件系统。这使得它非常适合在没有文件系统(如浏览器)的环境中使用,或者作为另一个工具链的一部分。下面是一个简单的变换:基础选项:高级选项:构建API调用对文件系统中的一个或原创 2022-04-04 20:43:27 · 1318 阅读 · 0 评论 -
完整的网站发布,部署入坑回忆记录
最近想搞个自己的网站瞎玩一下,以下纪录一下遇到的各种问题,讲道理应该遇到问题就记录,但是已经晚了,所以这里只能说回忆一下。1. 买个 linux 服务器我最后选择了在Portal Home - HostDare地方买了个服务器,至于为什么要在这里买,其实我也是个小白,从这里买纯粹是看到别人说很多中国人在这里买,而且看上去它的功能也比较全面吧,至少对我来言!具体的购买过程——请查看这个教程 (后期我再出个教程好了,这里先写上)2. 买个域名域名也是在 hostdare 里买的,买域名和配置原创 2022-03-21 11:31:16 · 1270 阅读 · 0 评论 -
git 之 git log命令原来还能这么玩
git 是目前一个非常流行的库管理工具,git log 也是比较重要的一个命令可以这么说,学会了 git log 基本上就学会了看一切这里简单说几个实用的命令1.显示前2次提交的日志git log -22. 显示最近一次提交的代码的详细信息git log -1 -p3. 显示最近一次提交的代码的简要信息git log -1 --stat4. 显示最近一次提交的代码的超级简要信息(hash和commen)git log -1 --pretty=on..原创 2022-02-17 00:39:36 · 979 阅读 · 0 评论 -
关于,px, vw, ch, rem, em,% 我们应用哪个
对于目前的 css 来说,我们的布局单位已经不局限于 px 了,那么我们应该在什么情况下使用哪些单位呢?1. vw, vh如果是想要针对页面的宽高布局,那我们就应该使用 vw 和 vh比如 100vw === 屏幕宽度10vw === 10% 的 屏幕宽度一般我们经常用到的地方就是用 100vh 来设置盒子的高度是整个屏幕高2. ch, rem, em这几个单位都是针对字体的大小设置的宽度1ch === 一个数字的大小1ch=== 半个汉字的大小因为我们的汉字是两.原创 2022-02-09 09:52:51 · 546 阅读 · 0 评论 -
zendesk 如何使用,设置对话框样式
vue项目使用zendesk_`俺命shiro的博客-CSDN博客vue + zendesk初始化,我这边写在app.vue 中1.将zendesk的js包放到index.html,js包的地址在zendesk的后台:设置->小组件2.初始化代码写在app.vue项目的要求是只有到服务tab下,zendesk才能出现,所以我在app.vue中现将zendesk隐藏zESettings可以设置组件的颜色之类的,具体可以看他们的文档,文档是全英的。...https://blog.csdn.net/weix转载 2022-01-07 12:04:46 · 1321 阅读 · 0 评论 -
react 使用 useEffect 只执行一次
本文主要讲解 使用 useEffect 在函数式组件中只执行一次,但是会报警告的问题该如何去解决首先只执行一次的话,使用函数作为useEffect回调,然后依赖项传空,像这样useEffect(fetchBusinesses, [])但是这样有一个问题,就是如果不填写依赖项,eslint 会抱一个警告,提示你需要依赖 fetchBusinesses1. 解决警告的一种方法是:声明内部功能useEffect(),将 fetchBussinesses 方法放在 effect 内部去声明.原创 2021-12-10 09:16:54 · 15843 阅读 · 1 评论 -
Cannot find module ‘@/xx/...‘ or its corresponding type declarations.Vetur(2307)
第一个可能原因 没有配置alias 请参考官方文档:FAQ | VeturVue tooling for VS Code.https://vuejs.github.io/vetur/guide/FAQ.html#vetur-can-t-recognize-components-imported-using-webpack-s-alias配置了之后如果没生效,继续往下看第二个可能原因 没有将项目放在第一个,也就是说你的 vscode 打开的必须是你的项目,而不是一个文件夹里边包...原创 2021-09-26 10:37:00 · 4307 阅读 · 2 评论 -
手摸手教你写 Promise
function MyPromise(func) { this.status = 'pending' // resolve, reject this.thenFuncs = [] this.catchFuncs = [] this.value = undefined func(MyPromise.resolve.bind(this), MyPromise.reject.bind(this))}MyPromise.resolve = function(result) { thi.原创 2021-08-23 14:24:14 · 99 阅读 · 0 评论 -
Nginx 的五大应用场景
一、HTTP服务器Nginx本身也是一个静态资源的服务器,当只有静态资源的时候,就可以使用Nginx来做服务器,如果一个网站只是静态页面的话,那么就可以通过这种方式来实现部署。1、 首先在文档根目录Docroot(/usr/local/var/www)下创建html目录, 然后在html中放一个test.html;2、 配置nginx.conf中的serverusermengdaystaff;http{server{listen80...转载 2021-07-26 09:23:22 · 84 阅读 · 0 评论 -
如何搭建一个强壮的 vue3 项目
众所周知,vue 是一个没有强大后台支撑,纯靠用户使用起飞的框架。现在 vue 是火的一批,在很多优秀的框架成熟的情况下,硬是撑起了前端的半片天。那么,vue 更新日新月异,一个好的项目系统对开发和维护都如虎添翼,后期维护更是不要太爽,那么如何搭建一个健壮的 vue3 项目呢?—— 以下内容不会涉及到 typescript,确实很强大,也有很多优点,我也喷不起,本人用过一段时间,放弃的原因用过的人可能会懂!首先我们现在基本上都是采用 @vue/cli 搭建项目,执行 vue createmy-.原创 2021-06-30 11:07:21 · 452 阅读 · 3 评论 -
js 实现封装 WebSocket 连接
首先,项目中如果需要长时间且不定时不间断地进行客户端与服务器端交互的时候,使用 WebSocket 连接是不二之选,比如交易所项目那么创建一个 WebSocket 需要什么功能,怎么才能是一个健壮的 ws 体系呢?首先我们需要几个基础功能:1. onopen(ws 连接成功回调)2. onmessage (ws 返回数据回调)3. onclose (ws 关闭回调)4. onerror(ws 报错回调)当我们的 ws 有这些方法之后,我们就需要加几个方法用来和服务器端交互..原创 2021-06-25 11:50:59 · 2779 阅读 · 7 评论 -
移动端H5开发常用技巧总结
从https://mp.weixin.qq.com/s/cHTCu3xF5wQSYiqsUZ7kBQ转载!解决的问题如下,如果有,请自己去下边找1. Android禁止屏幕旋转2. 移动端全屏显示3. UC应用模式,使用了application这种应用模式后,页面讲默认全屏,禁止长按菜单,禁止收拾,标准排版,以及强制图片显示。4.QQ强制竖屏5. QQ强制全屏6. QQ应用模式7. 开启/关闭 电话号码(邮箱)自动识别8.开启长按邮箱地址弹出邮件发送的功能...转载 2021-03-01 13:42:07 · 177 阅读 · 0 评论 -
一些你不知道的 web API
一些你不知道的 web APIBackground Tasks APIBackground Tasks API幕后任务协作调度 API (也叫幕后任务 API 或者简单称为 requestIdleCallback() API) 提供了由用户代理决定,在空闲时间自动执行队列任务的能力。Window.requestIdleCallback() 允许浏览器告诉您的代码可以安全使用多少时间而不会导致系统延迟,从而有助于确保浏览器的事件循环平稳运行。如果您保持在给定的范围内,您可以使用户体验更好目前,t原创 2021-02-25 18:38:09 · 267 阅读 · 0 评论 -
js 拖拽上传文件
主要依靠的 web dom 事件是:dragover 和drop<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> <title></title> &...转载 2019-08-01 15:03:13 · 411 阅读 · 0 评论 -
webpack 简易配置文件
webpack.config.jsconst HtmlWebpackPlugin = require('html-webpack-plugin')const webpack = require('webpack')const VuePlugin = require('vue-loader/lib/plugin')const { resolve } = require('./util')...原创 2019-07-31 10:43:06 · 99 阅读 · 0 评论 -
js 的 Math 属性方法
写这个其实有点小白了,但是我最近又忘了那个二次方的方法怎么写了!唉,废人多往事!写一遍加深一下记忆。1. 取绝对值。这个太简单,不用举例子了 Math.abs(x)2. 向上取整。太简单直接看例子吧! Math.ceil(x)Math.ceil(0.1) => 1Math.ceil(1) => 13. 向下取整。...原创 2019-06-24 10:49:38 · 274 阅读 · 0 评论 -
Vue.config.optionMergeStrategies 用法分析
Vue.config.optionMergeStrategies 是定义一个合并的策略怎么说?其实就是vue的 mixins属性。接收一个数组[ components],数组里是其他vue的实例。比如你写了这个:Vue.config.optionMergeStrategies.name = function (from, self) { return self.nam...原创 2019-05-16 17:52:03 · 6337 阅读 · 0 评论