HTML
文章平均质量分 76
未成年梦想
这个作者很懒,什么都没留下…
展开
-
tdesign的白天黑夜模式实现原理
以tdesign为例。原创 2023-06-05 11:01:49 · 410 阅读 · 0 评论 -
前端div水平居中的几种实现方式
awidth;height;;display;;;height;;</</</</原创 2023-06-05 10:59:00 · 508 阅读 · 0 评论 -
知乎日报项目前端+后端-React18 + React-Router6 + React-redux + redux/toolkit
技术栈使用React18 + React-Router6 + React-redux + redux/toolkit + craco(重写配置) + ( amfe-flexible + postcss-pxtorem 达到适配 ) + lesskeep-alive效果没实现,找了几个库效果都不理想,就没去弄了。原创 2023-04-03 21:53:29 · 601 阅读 · 3 评论 -
Vant组件当中van-list的使用在自定义列表当中
vant官网没有提及自定义列表当中的使用,并且只有一些简单的例子,这里记录下我使用vant-list的记录代码,Vant组件当中van-list的使用在自定义列表当中原创 2023-02-23 12:27:37 · 944 阅读 · 0 评论 -
微信小程序模块化、组件传值、添加data,menthods类型等记录-持续更新
微信小程序模块化、组件传值、添加data,menthods类型等记录-持续更新原创 2023-02-05 19:45:50 · 1625 阅读 · 1 评论 -
无js实现拖拽边框改变大小的笔记
最近刷抖音看到一款游戏"拣爱",看到这个人手动拖动的很有意思,就想着能不能前端实现,来学习学习,虽然说最终的效果没有gif图片那么好,但是也算实现了,吧…原创 2023-02-02 09:33:44 · 348 阅读 · 0 评论 -
flex1和auto区别-好记性不如烂笔头
* flex: 1;/* 根据内容动态分配 */原创 2023-02-02 09:28:34 · 114 阅读 · 0 评论 -
css之grid布局个人学习笔记
划分网格以后,容器的子元素会按照顺序,自动放置在每一个网格。默认的放置顺序是“先行后列”, 即先填满第一行,再开始放入第二行 (原创 2022-12-20 15:33:03 · 879 阅读 · 0 评论 -
使用backdrop-filter实现elementui官网的模糊滤镜效果的和毛玻璃效果
backdrop-filter属性filter属性二者区别二者支持的滤镜对比(其实filter可以用的,backdrop-filter都可以用)我们重点关注下面几个属性为什么设置background-size和background-image:设置背景图片大小,这个不用多说设置背景图片的大小所以我们如果只设置这二个值会发生什么?为了便于观看,我将换为了一张具体图片,便于查看初次的时候你可能看到这个效果是不是觉得这个点点是什么,我们放大看看可以看到,只不过背景被替换为了一个一个原创 2022-11-25 08:29:06 · 2049 阅读 · 4 评论 -
js的promise的究竟是同步还是异步的问题和promise.all可以同时请求多个接口是错误的回答的原因
我们知道,js是单线程的,所以分为同步和异步,我们创建promise的时候是同步执行的,原创 2022-11-19 21:23:24 · 859 阅读 · 0 评论 -
‘flex设置为1后为什么要设置width为0,和布局超出省略号为什么会超出容器,为什么会没有用和在苹果环境下获取屏幕高度需要注意的点
最近在做手机端的页面,制作过程出现了flex布局的一些问题,再次记录在解决办法关于在flex:1的情况下设置为width的效果如果没有设置width,当内部元素的内容大小超过平均分配的剩余空间时,元素的宽度等于内容大小,如果设置了width并且这个width的大小小于平均分配的剩余空间大小时,取平均分配的剩余空间;当flex设置为 1 时 相当于 剩余空间大小 = 父元素的宽度 因此平均的剩余空间大小等于 = 父元素的宽度 / 元素的个数,直接设置width为0可以保证元素宽度平分父元素宽度。原创 2022-11-17 23:04:59 · 3029 阅读 · 0 评论 -
vue当中script setup语法糖
之前的emit写法App.vueconsole . log("我会说sayHello哦" , value);};< template > < button @ click = "handleClick" > 单击我 - userInfo < / button > < / template > < script > export default {emit }) {emit("sayHello" , "我是UserInfo传的消息");};return {原创 2022-09-11 19:57:12 · 1361 阅读 · 0 评论 -
微信小程序抓包-夜神模拟器结合BurpSuite抓包(可用于现在最新版本微信)
即可,我看另外一个人的教程计算生成出来的结果和这个一样,可能是统一的吧。这一步好像可以跳过,直接把转换后的per证书名称改为。OpenSSL默认的安装路径我这里是。,然后安装的时候一直下一步即可。安装完成后就要配置运行环境了。安装好微信后登录自己微信。原创 2022-09-04 16:45:32 · 17052 阅读 · 33 评论 -
vue当中绑定回调函数的时候添加括号和不添加括号的区别
相不添加括号 @click = “handleClick” 会默认传入一个event参数。添加括号 @click = “handleClick()” 则不会传入参数。我们书写下代码(很简单的代码,对比输出不同而已)原创 2022-09-01 08:24:04 · 744 阅读 · 0 评论 -
vue控制台警告Runtime directive used on component with non-element root node.
你昨天晚上又没会我的消息,在我孜孜不倦的骚扰下,你终于舍得回我了,你说“滚”,这其中一定有什么含义,我想了很久,滚是三点水,这代表你对我的思念也如滚滚流水一样汹涌,我感动哭了,不知道你现在在干嘛,我很想你。今天我还是照常给你发消息,汇报日常工作,你终于回了我四个字:“嗯嗯,好的”你开始愿意敷衍我了,我太感动了受宠若惊。sh-a傻,噢你的意思是说我傻,那b就是baby的意思了吧,原来你是在叫我傻宝,这么宠溺的语气,我竟一时不相信,其实你也是喜欢我的对吧。滚就滚,我看不了青春有你,我的青春也没有你。...原创 2022-09-01 08:22:48 · 33353 阅读 · 10 评论 -
vue3全局事件总线-mitt的使用(和vue2的全局总线不同)
/也可以写完整嗲 const emitter = mitt();//每调用一个mitt,都是一个总线,所以这里为什么要封装为一个工具库,就是只使用一个总线 export default emitter;原创 2022-09-01 08:21:00 · 1756 阅读 · 0 评论 -
vue3中使用混入mixins在setup当中
我们知道,在vue2的时候,想使用混入,直接就使用,但是在vue3里,就不一样了,多了`setup`那么我们怎么使用混入在vue3当中的`setup`呢?关键就是`getCurrentInstance`原创 2022-08-30 09:24:55 · 6212 阅读 · 0 评论 -
我来图书馆小程序一键签到和一键抢位置工具
我来图书馆小程序一键签到和一键抢位置原创 2022-07-25 15:19:55 · 11529 阅读 · 34 评论 -
关于flex布局justify-content:space-around最后一个不对齐的解决方法和为什么这样子解决是讨论
参考文章@flex布局设置space-between(around)最后一行不左对齐问题-解决办法@[译]当咱们在使用displayflex的时候,到底发生了什么?大家可能都遇到过下面这种情况,在布局的时候我们不得不设置并且效果本来想是下面这张图右边的效果,但是显示的却是左边的效果了其实解决也很简单,在最外层添加一个伪类即可html结构......原创 2022-07-22 11:33:42 · 4607 阅读 · 1 评论 -
uni-app知识点和项目上遇到的问题和解决办法的记录
参考文章@flex布局设置space-between(around)最后一行不左对齐问题-解决办法@[译]当咱们在使用displayflex的时候,到底发生了什么?大家可能都遇到过下面这种情况,在布局的时候我们不得不设置并且效果本来想是下面这张图右边的效果,但是显示的却是左边的效果了其实解决也很简单,在最外层添加一个伪类即可html结构...原创 2022-07-22 11:28:56 · 1709 阅读 · 0 评论 -
影视节前端网站,,以前东拼西凑的,前端课程设计应该可以吧.
影视节前端网站,,以前东拼西凑的,前端课程设计应该可以吧.原创 2022-07-15 09:04:35 · 227 阅读 · 0 评论 -
微信小程序相关知识点和云音乐项目制作遇到的问题及解决
微信小程序相关知识点和云音乐项目制作遇到,通过媒体查询的方式,也就是据屏幕的大小自动的调整页面的展现方式响应式的概念应该是覆盖了自适应,但是包括的东西更多了全局配置(),需要添加字段为某一个页面配置(比如说video页面),就不需要添加字段了@官网API接口 只有一个,所以执行在里面,而在每一个页面执行的是函数可以配置一些生命周期,并且可以用来全局数据App.js当中内容代码如下如果需要获取App.js所生成的实例化对象,其他js文件需要调用函数,经常用来读取设置的全局数据xxx.js(不同页面不原创 2022-07-14 16:30:50 · 3632 阅读 · 0 评论 -
问卷星问卷抓包分析
如图,可以看到提交是数据,我们先以来进行全局搜索这次全局搜索注意点在没有提交之前进行全局搜索搜索才可以搜索到,不然提交完成后全局搜索什么都搜索不到如图,没有提交之前搜索,可以看到关键字就在网页源代码里面~所以每次请求网页都会发生变化jqsign参数加密分析加密关键js和代码,如图代码...原创 2022-06-28 08:57:21 · 4175 阅读 · 4 评论 -
vue3.0的学习
2.使用 vite 创建官方文档:https://v3.cn.vuejs.org/guide/installation.html#vitevite官网:https://vitejs.cn传统构建 与 vite构建对比图主要区别1.引入的不在是vue2.x时候的vue构造函数了,而是引入的是一个名字叫的工厂函数,并且比原来的构造函数更轻(我理解的是大小更小,加载更快)2.在vue3.x结构当中,部分的内容可以不被一个统一的容器所包裹了vue3.x的 main.js 初始化时的代码二.常用的Co原创 2022-06-25 16:36:15 · 2525 阅读 · 0 评论 -
记录下bilibili(b站)小火箭页面上划动画效果的实现
觉得这种bilibili小火箭很有意思,想看看怎么实现的,发现是精灵图来实现的原创 2022-06-08 23:15:52 · 1566 阅读 · 2 评论 -
Typescript的学习笔记
使用命令对ts文件进行编译进入命名行进入ts文件所在目录执行命名即可,xxx.ts中xxx为文件名如果没有在报错的情况下进行编译,默认情况下依旧会进行编译,但是可以后期配置不编译编译可以编译为任意js(兼容性处理更加好),后期可以通过配置文件进行配置ts的基本类型类型声明是TS非常重要的一个特点通过类型声明可以指定TS中变量(参数、形参)的类型指定类型后,当为变量赋值时,TS编译器会自动检查值是否符合类型声明,符合则赋值,否则报错简而言之,类型声明给变量设置了类型,使得变量只原创 2022-06-06 09:07:25 · 1544 阅读 · 0 评论 -
webpack构建工具的学习
什么是webpack是一个模块打包工具webpack将前端的所有资源文件(js/json/css/img/less…)都看做模块,来进行处理会根据模块的依赖关系进行分析,生成对应的资源原生的webpack只可以完成js/json的打包编译,而转换什么的需要其他插件进行完成,比如说es6转es5,箭头函数转换,都需要依赖其他loader或者插件五个核心概念入口(entry): 告诉webpack应该使用哪个模块,作为构建内部依赖图的开始,比如vue中我们经常在一个文件夹当中建立index.j原创 2022-05-29 14:55:26 · 1254 阅读 · 0 评论 -
小红书2020校招前端笔试题卷一
题目1-下列说法正确的是()多选A: requestAnimationFrame(foo) 确保使浏览器在下一次重绘之前调用 foo 方法B: 在 addEventListener 的处理方法中使用 e.preventDefault() 可以阻止事件冒泡C: 把 <script> 标签的引入放在文档末尾可以确保脚本下载和执行均在文档解析完成后发生D: 多个 <script> 标签使用 defer 属性引入脚本时,可以确保脚本的执行是按照其被引入的顺序的答案原创 2022-05-28 11:20:51 · 1242 阅读 · 0 评论 -
移动端适配vue小练习
移动端Vue适配小练习为了练习,就没有使用自动转换rem的功能,想了解的可以看看这几位博主的博主1博主2想看源码的可以到github或者gitee上下载(后台也打包好了)github地址gitee地址项目遇到的问题记录Navigation aborted from “/center“ to “/login“ via a navigation guard解决方法:vue_project\src\router\index.js 路由主入口文件当中添加如下代码const o原创 2022-05-24 20:33:32 · 219 阅读 · 0 评论 -
移动端前端的适配和rem,vm其他的一些的复习
屏幕分辨率注意:屏幕分辨率是一个固定的值,屏幕生产出来就确定了,无法修改!我们在电脑所设置的,都是显示分辨率! 显示分辨率和屏幕分辨率是二个概念!屏幕密度每英寸里包含的物理像素点的个数,单位是PPI(pixels per inch),还有另外一个是dpi(dots per inch) ,dpi是衡量打印机的,ppi是衡量屏幕的计算公式:像素相关物理像素又称:设备像素,物理像素是一个长度单位,单位是px,1个物理像素就是屏幕上的一个物理成像点,就是屏幕中一个微小的发光物理元器件(可原创 2022-05-24 20:33:03 · 892 阅读 · 0 评论 -
vue一些比较重要知识点的复习
Vue的MVVM模型知道什么是MVVMM: (Model 模型) 即后端传递过来或者自己定义的数据(对应vue组件当中的data,props,computed等)V: (View 视图) 即用户看到的界面UI (也就是我们组件当中的template部分)VM: ViewModel,负责实现View和Model之间数据状态同步的中间对象MVVM的关系MVVM优点在MVVM架构下,View 和 Model 之间并没有直接的联系,而是通过 ViewModel 进行交互,Model 和 V原创 2022-05-22 11:22:14 · 1245 阅读 · 7 评论 -
vue后台的一个项目遇到的一些问题和解决办法的记录
vue使用echarts报错Error in mounted hook: “TypeError: this.dom.getContext is not a function”解决一开始是this.refs.dom获取节点的,后面使用在‘<el−row>‘标签上就不可以,所以如果使用this.refs.dom获取节点的,后面使用在`<el-row>`标签上就不可以,所以如果使用this.refs.dom获取节点的,后面使用在‘<el−row>‘标签上就不可以,所以如原创 2022-05-21 21:04:08 · 2585 阅读 · 0 评论 -
盒子模型及块元素水平垂直定位和绝对元素的定位布局和弹性盒
盒子模型组成:content(内容区)border(边框)padding(内边距)margin(外边距)盒子大小盒子的大小值得就是盒子在容器中实际所占据的高度和宽度(默认情况下我们通过css设置的width和height只是设置了content(内容区)的高度和宽度,实际上盒子模型所占据的高度和宽度是按照下面来计算的)实际的宽度:实际宽度 = margin-left + border-left + padding-left + width(content-width) + paddin原创 2022-05-21 21:03:13 · 805 阅读 · 0 评论 -
vue源码分析-快速版(DMQ的MVVM为例)
感兴趣的可以下载这位老师的例子使用的DMQ的MVVM为例地址(单击我跳转)前置知识知道节点nodeNamenodeTypenodeValue文档节点#document9null元素节点标签名1null属性节点属性名2属性值文本节点#text3文本内容知道一些方法或者属性dom元素.childNodes属性,获取dom元素下的所有节点(包括文本节点和其他(换行符也是文本节点))而dom元素.children是获取d原创 2022-05-20 21:47:58 · 306 阅读 · 0 评论 -
Echarts图表的基本使用
Echarts的初始化使用引入什么的就不多说了,普通的js脚本怎么引入echarts就怎么引入大概初始化的步骤获取DOM(用于绘制表格)依据获取的DOM对象初始化echarts(使得这个DOM对象用于展示图表数据)书写echarts配置对象第二步返回的echarts对象调用setOption方法并传入第三步书写的配置对象别忘记设置Dom容器的宽高了(css设置即可)好像如果是同一个echarts实例化对象,再次调用setOption方法,不会造成图表全部重新绘制,原创 2022-05-16 23:57:32 · 2286 阅读 · 3 评论 -
vue-admin-template里面的异步路由,常量路由,任意路由的添加,记录笔记
路由模式常量路由(比如首页)异步路由(不同用户不同路由,根据权限来定的)任意路由(比如404)vueAdmin当中使用路由权限1.在路由注册的时候,分段注册 (默认只注册常量路由)src\router\index.js2.处理路由信息,并添加到route当中调用router当中的addRouter方法,传入的参数为数组(数组里面也就是路由信息)src\store\modules\user.js当中,根据token获取到用户信息后(比如用户权限,可以用的路由有哪些),来对数原创 2022-05-16 23:51:00 · 1675 阅读 · 0 评论 -
vue当中addRoutes动态添加路由白屏解决和next(),next(“/“)的一些区别
vue当中addRoutes动态添加路由白屏解决和next(),next("/")的一些区别原创 2022-05-16 23:47:47 · 2727 阅读 · 2 评论 -
尚品汇Vue项目 前台+后台完成品源码(含在线演示)
尚品汇前台练习在线地址演示1(前台项目): http://82.156.205.62:8081/在线地址演示2(前台项目): http://82.156.205.62:8083/自己添加了下收货地址和删除收货地址(样式没有过多去处理~)有时候主页的一些数据老是获取不到,用了假数据(但是数据内容和接口地址是一样的)添加地址信息弹窗全部改为element-ui的message提示项目依赖安装npm install项目运行npm run serve项目打包编译npm r原创 2022-05-16 17:06:24 · 12464 阅读 · 17 评论 -
默认暴露,分别暴露,整体暴露的再次学习及常用知识
三个暴露相同点可以理解为都是暴露出一个对象给其他使用!无论是哪一个暴露方式,想要直接获取到暴露出去的对象,可以使用import * as 名称 from "xxx.js"//比如import * as $API from "xxx.js"默认暴露默认暴露js代码里面,只可以有一个默认暴露(也就是只能由一个export default出现)否则出现Uncaught SyntaxError: Identifier '.default' has already been declar原创 2022-05-15 20:02:23 · 5193 阅读 · 1 评论 -
canvas基本使用
文章目录canvas的基本了解canvas的基本步骤canvas绘制矩形和圆绘制矩形绘制圆绘制字体清空画步和清除指定区域清空画布清除指定区域canvas绘制一个柱形图效果代码过程图canvas的基本了解canvas仅仅只是一个画布,定义一个canvas标签,需要通过属性,属性,属性来设置宽度高度(不可以通过样式!),如果不设置默认300*150不通过属性设置画布的宽度和高度,会造成坐标不准确的问题!canvas必须要通过js来操作canvas的坐标是从左到右是x轴,从上到下是y轴原创 2022-05-13 23:57:27 · 431 阅读 · 0 评论