- 博客(14)
- 收藏
- 关注
RSS订阅原创 了解前端中的BFC(块级格式化上下文)
BFC(块级格式化上下文)什么是BFC指的是一个块级渲染作用域,该区域内拥有一套完整的规则来约束块级盒子的布局,且与区域外部无关.为什么要使用BFC当一个盒子不设置高度,当其中的子元素都浮动时,这个盒子便无法撑起自身.这个问题可以使用BFC来解决,形成一个块级格式化上下文.那么如何创建BFCfloat的值不为noneposition的值不为static或relativedisplay的值为inline-block,flex,inline-flex设置overflo
2022-04-11 13:10:31
406
原创 JavaScript中this的绑定
this指向问题在javascript中this绑定有以下几种方式默认绑定function foo(){ console.log(this.a);}var a = 1;foo(); // 1以上绑定代码即为this的默认绑定,当函数没有其他绑定时,此时this指向window对象;隐式绑定隐式绑定需要考虑的是调用位置是否有上下文对象.如下代码所示:function foo(){ console.log(this.a);}var obj = { a:'obj
2022-04-09 00:32:00
1585
原创 一次渲染上万条数据不卡简单代码
渲染几万条数据不卡就不能将数据一次性的渲染出来,而是需要分段渲染,一次渲染20条,30条,50条等,来分多次渲染. 先把代码贴出来然后再一一解释:<ol></ol>setTimeout(()=>{ // Ⅰ定义变量 let totalData = 10000; let once = 20; let renderCount = 0; let loopCount = Math.ceil(totalData / once); let o
2022-04-07 08:15:00
628
原创 了解web网络基础
TCP/IP协议:一种规则,规定不同计算机操作系统,硬件之间怎么通信的一种规则像这样把互联网相关联的协议集合起来总称为TCP/IP协议.TCP/IP分层管理按照组层次分为以下四层:应用层:决定了向用户提供应用服务时通信的活动tcp/ip协议族内渔村了各类通用应用服务比如FTP和DNS等传输层:对上层应用层,提供处于网络连接中两台计算机之间的数据传输.在传输层有两个性质不同的协议:TCP和UDP网络层:又名网络互联层有,用来处理网络上流动的数据包数据包使网络传输的最小数据单
2022-04-04 22:34:12
2563
原创 近期uniapp使用与总结
总的来书uniapp的开发和vue的开发差不多,所以用起来也就很快的熟练了起来,但是有些组件以及api的调用还是不同 首先从uniapp新建项目开始吧,因为我要做的是uni-app所以就选择了默认的模板.然后来看一下
2022-04-01 14:31:08
1089
原创 网站性能优化
在此之前先谈谈为什么要对网站进行优化我认为有两个主要的方面一: 为了提高用户的浏览体验,我想没有一个用户在访问网站时等个几秒钟后,网站页面还为加载出来,此时对网站的优化是优化性能,优化交互,使用户喜欢上这个网站,使网站变得更加的友好.二:为了提升网站的排名,做一个网站最大的目的是为了展示信息,那么如何更好的展示信息呢,这里就需要对网站进行搜索引擎优化(SEO),通过优化提升浏览器在搜索引擎中的排名,使自己的网站优先展示.接下来说一下怎么对网站进行性能优化进行性能优化无非是为了提高浏览器的加载速度和
2022-03-29 15:41:34
3392
原创 深拷贝与浅拷贝
在了解深浅拷贝前需要首先先谈谈拷贝的概念拷贝拷贝就是拷贝指向对象的指针，意思就是说：拷贝出来的目标对象的指针和源对象的指针指向的内存空间是同一块空间，浅拷贝浅拷贝是按位拷贝对象，它会创建一个新对象，这个对象有着原始对象属性值的一份精确拷贝。如果属性是基本类型，拷贝的就是基本类型的值；如果属性是内存地址（引用类型），拷贝的就是内存地址。深拷贝深拷贝，在拷贝引用类型成员变量时，为引用类型的数据成员另辟了一个独立的内存空间，实现真正内容上的拷贝。浅拷贝的四种方式1.键值拷贝let pl={na
2021-11-25 13:59:35
400
原创 Vue学习之认识ref
ref相当于一个dom节点，值为string通俗将类似于原生js的document.querySelector(‘xxx’)；但是不同的是vue是操纵虚拟dom，在渲染初期并没有这个属性，而是在创建vue实例后才加到虚拟dom中。其中ref有以下几种常见用法：本页面获取dom元素 <div ref="divmsg">divmsg</div> <button @click="getmsg">div内元素</button>getmsg(){ con
2021-08-17 00:23:18
334
原创 elementui中deep的用法/deep/
在做第一个vue项目时遇到了一个问题，在使用elementui中的Drawer（抽屉组件时），想要修改Drawer的标题，尝试着修改title的样式，但没有效果，尝试了很多方法，最后用/deep/解决了问题通过深度选择 .el-drawer 中的title即可修改标题样式成功 /deep/ .el-drawer__header{ color: white; }在此之后可以用/deep/来修改elementui中一些其他组件的样式...
2021-08-05 23:43:03
6335
原创 vue报错解决Duplicate keys detected: ‘[object Object]’
最近在做vue项目时遇到了报错 Duplicate keys detected: ‘[object Object]’. This may cause an update error. 由于这个问题是第一次遇见，所以在解决起来废了点时间解决：在遍历数组时 :key书写错误， 我的错误写法 <ul> <li v-for="v in caseintrocon" :key="i"> <p><e
2021-08-01 21:14:58
2718
原创 Vue两组间通过传值设置另一个组件背景
vue项目中，从一个组件获取图片url，并为另一个组件设置该图片为背景的盒子子组件<template> <div class="intd_content_banner" :style="{background:'url('+banner.url+')'}"> </div></template><script> export default { props:['banner'],
2021-07-31 10:59:00
306
原创 border属性之border-radius
border-radius - 指定每个圆角如果你在 border-radius 属性中只指定一个值，那么将生成 4 个 圆角。但是，如果你要在四个角上一一指定，可以使用以下规则：四个值: 第一个值为左上角，第二个值为右上角，第三个值为右下角，第四个值为左下角。三个值: 第一个值为左上角, 第二个值为右上角和左下角，第三个值为右下角两个值: 第一个值为左上角与右下角，第二个值为右上角与左下角一个值： 四个圆角值相同border-radius所有四个边角 border-*-
2021-07-19 10:05:35
941
原创 本地数据local storage和session storage
随着互联网的快速发展,基于网页的应用越来越普遍,同时也变的越来越复杂,为了满足各种各样的需求,会经常性在本地存储大量的数据, HTML5规范提出了相关解决方案。本地存储特性1、数据存储在用户浏览器中2、设置、读取方便、甚至页面刷新不失数据3、容量较大, sessionStorage约5M、localStorage约20Mwindow.sessionStorage1.生命周期为关闭浏览器窗口2.在同一个窗口（页面）下数据可以共享3.以键值对的形式储存使用...
2021-01-12 09:45:22
1119
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人