weixin_54256573的博客

原创 页面刷新 、nextTick

应用场景：在写页面的时候，对于修改信息或者是修改表单数据时，页面所渲染的数据于要求实现与数据库信息同步，展示最新的数据，会用到数据刷新。下面有三种方法：写法简单可以实现效果：第一种：this.$router.go(0)第二种：location.reload()注：前两种方法都是最直接的整个页面刷新，会出现一瞬间的空白，用户体验感不好第三种最实用 推荐实用（地址栏路径不变，只是页面显示的是内容会刷新一下）注：进行编辑操作，通过v-show控制input的显示与.

原创 vue菜谱项目搜索

敲回车实现搜索或者对按钮绑定事件，这两种方式都可以实现比如：但是需要注意的是,在elementui中绑定敲回车事件写成上边那个样子会无效，在原有基础上多加一个.native就可以了如下：近期的vue食谱项目中写的那个前台搜索在这里就浅浅总结一下吧首先要实现的是在页面头部搜索框中输入信息，跳转到一个搜索页面，进行搜索，页面布局差不多是这个样子写这块的时候用了三种的方式，都可以实现，但最后是选择利用vuex来实现的。方法一：将搜索信息储存到本地，利用localstorage实现，功.

原创 vue中组件间的通信

组件中的通信方法有很多种，下面就做总结一下经常用到的一些吧！1. props和$emit父组件向子组件传递数据是通过prop传递的，子组件传递数据给父组件是通过$emit触发事件来做到的。父给子传值：子给父传值：总结：1).父组件传递了message数据给子组件，并且通过v-on绑定了一个getChildData事件来监听子组件的触发事件；2).子组件通过props得到相关的message数据,最后通过this.$emit触发了getChildData事件。...

原创 vue中实现图片上传

前言：之前感觉上传图片很难，每次写都感觉特别麻烦，但思路清楚之后就感觉还行，没有想像中那个复杂，接触vue之后感觉很多地方相对于之前而言更加方便，用多个组件，相同的可以进行组件复用，减少代码的重复，下面就说一下近期食谱管理项目实战中的上传图片功能吧！1、预览图2、大致思路页面布局：设置两个均为100px的盒子，左侧是预览图（浏览上传的图片），右侧是操作图（input框占满盒子并隐藏起来，可以通过opacity: 0来实现，给input绑定@change=‘showImg’事件，如果改变了就.

原创 vue-router中meta的作用

用Vue做网站登录验证时常用到Vue-Router官方路由器管理，这时候会调用beforeEach函数，1：2、可以用来做一些登录校验也可以用来实现面包屑功能通过$route可以获取到刚才路径中写的meta，而mata是一个数组，借助v-for实现页面渲染，当然meta里边有其他信息是也可以为一个对象，通过以下方式也可以实现...

原创 vue-router中的router-link的active-class

使用选中样式有两种方法（显示高亮即选中状态）解决以上问题方法如下：（两种）

原创 近期感悟-大二上

时间过的很快，没想到大二上学期就这么快过去了，自己还感觉刚迈进大学，心中满怀希望，现如今，经过大一的历练，我自己更加知道自己想要什么了，也更加明确自己要怎样去实现自己的目标，我想在接下来的日子里要更加努力去实现自己的理想，做勇敢的追梦人。 小组的学长学姐们都很优秀，给了我很多的帮助，我也学到很多东西，在他们身上我能够深刻的感受到一种特别拼，敢拼敢闯的精神，能够进下心来去学习技术，不断进步，我想这就是青春最美的样子，为了自己的理想去奋进，这也是最令人尊敬的，每个人都有一段看不见光的日子，我想那叫...

原创 IntersectionObserver

IntersectionObserver可以实现类似于监听目标元素的祖先元素与视窗的交叉状态，简单地说就是能监听到某个元素是否会被我们看到，当我们看到这个元素时，可以执行一些回调函数来处理某些事务。...

原创 html，css基础

原创 上下取值协议端口域名bodyparser

1、Math.ceil() 方法可对一个数进行上舍入，返回值大于或等于给定的参数。2.Math.floor()可以获得一个数的整数部分，而不是四舍五入

原创 【无标题】

cookie和session1、Cookie和Session的区别与比较1、Cookie放在浏览器上，Session放在服务器上2、cookie不是很安全，别人可以分析存放在本地的COOKIE并进行COOKIE欺骗,考虑到安全应当使用session。3、session会在一定时间内保存在服务器上。当访问增多，会比较占用你服务器的性能,考虑到减轻服务器性能方面，应当使用COOKIE。4、单个cookie保存的数据不能超过4K，很多浏览器都限制一个站点最多保存20个cookie。2、介绍c

原创 事件捕获与冒泡

捕获：从外层向里层去获取冒泡：从里层向外层去冒泡事件委托：子元素要达到某种效果，将事件委托给父元素，来实现效果。 对于子元素较少的情况下，使用循环遍历来实现效果，但子元素较多的时候依次遍历会比较麻烦，增加负载量，此时就可以用过给父元素委托事件来实现子元素要达到的效果。步骤：目标是实现点击每一个li标签，对应的那个消失1、获取ul：let ul=document.getElementById('ul')2、对ul绑定事件ul.onclick=functio...

原创 前端验证码实现

<canvas>元素：<canvas>看起来和<img>标签一样，只是 <canvas> 只有两个可选的属性 width、heigth 属性，而没有 src、alt 属性。​ 如果不给<canvas>设置widht、height属性时，则默认 width为300、height为150,单位都是px。也可以使用css属性来设置宽高，但是如宽高属性和初始比例不一致，他会出现扭曲。所以，建议永远不要使用css属性来设置<canvas&gt...

原创 onresize() offsetwidth等集中高度

1、onresize()调整浏览器窗口时，使图片等控件自适应地变化大小2、常见的几种宽高3瀑布流实现有三种方式

原创 数组中一些常用的方法：

map():map() 方法返回一个新数组，新数组中的元素为原始数组中的每个元素调用函数处理后得到的值。map() 方法按照原始数组元素顺序依次处理元素,不会改变原始数组。函数的作用是对数组中的每一个元素进行处理，返回新的元素。语法map是数组的方法，有一个参数，参数是一个函数，函数中有3个参数参数1：item必须。当前元素的值参数2：index，可选。当前元素在数组中的索引值参数3：arr可选。当前元素属于的数组对象array.map(function(item,index,a

原创 感悟（2021年10月25日）

时间过得真快，转眼间已成为大二的学姐了，回想起过去一年的大学生活，感觉很充实，也没有留下什么遗憾，自己尝试过很多东西，参与过很多活动，组织班级做游戏，冬至包饺子 ，红歌比赛等等，也在元旦晚会舞台上表演过节目，虽然很忙，但很快乐也很荣幸，在这些活动中，我不断在锻炼自己，收获了不一样的成长，也沉浸在其中，我非常感谢我的代班学长学姐在我开学的时候很迷茫的时候引导我，让我少走了很多的弯路，也正是因为学长学姐们对我的关爱，鼓励，引导，使我对代班这一职位有着深厚的感情，这是信工院的一种传承，我想尽我所能，把我学到的，我

原创 this指向

12

原创 Cookie和Session的区别

cookie和session的共同之处在于：cookie和session都是用来跟踪浏览器用户身份的会话方式。1.cookie 是一种发送到客户浏览器的文本串句柄，并保存在客户机硬盘上，可以用来在某个WEB站点会话间持久的保持数据。2.session其实指的就是访问者从到达某个特定主页到离开为止的那段时间。 Session其实是利用Cookie进行信息处理的，当用户首先进行了请求后，服务端就在用户浏览器上创建了一个Cookie，当这个Session结束时，其实就是意味着这个Cookie就过期了。注

原创 preventDefault()

1.如果事件是可取消的，则 preventDefault() 方法会取消该事件，这意味着属于该事件的默认操作将不会发生。举例，在以下情况下有用：单击“提交”按钮，阻止其提交表单 单击链接，防止链接跟随 URL 防止复选框的默认操作： document.getElementById("myCheckbox").addEventListener("click", function(event){ event.preventDefault()}); 注释：并非所有活动都可以取消。p

原创 nodejs

1._filename和_dirname_filename:返回当前模块文件被解析过后的绝对路径，该属性并非全局，而是模块作用域下的console.log(_filename);_dirname:返回当前模块文件解析过后所在的文件夹(目录)的绝对路径，该属性也不是全局的，而是模块作用域下的console.log(_dirname);2.path路径3、promise...

原创 更进一阶m

1.js中在window.onload中调用function函数执行以下代码，第二个弹框不会出现<input type="submit" id="tijiao" onclick="cphclick();" value="提交"/>js代码：<script type="text/javascript">window.onload=function(){ alert("hahaha"); function cphclick(){ ale...

原创 2021-08-15

近期项目完善感悟从第一次项目考核到现在也有一段时间了，在项目完善过程中我感受到了自身在一些基础知识上还是有很大漏洞的，比如说对于单选复选按钮的name要设置成一样的，我就去查阅了一些资料，找了一些视频去进一步学习form表单，单选性别按钮除了name外，在相应的文字里加入label标签，可以在点文字的时候也实现选中功能，增加用户体验，还有下拉框这个，在学习的时候只是知道有这回事，但是并没有实际操作过，现在可以更加深刻地体会到桃峰学长说的那句话了，要在项目中把学到的东西运用到里边，查漏补缺，这样才是学到了。

原创 第一项目考核后感想

时间过得很快，昨天晚上我们进行了第一次项目考核，我们做的是博客项目，从开始做项目到昨晚的考核差不多二十天时间，我感觉这相对于之前没进小组的我来说是一次突破，没进小组之前，一直听身边其他在小组的同学说我们这两天在做项目什么的，之前对项目这个并不是很了解，就觉得听说做项目什么的听着名字就很高大上，我感觉很幸运，能够加入未来这个大家庭，从面试小组到现在差不多是两个多月的时间，能够从一个啥也不知道啥也不懂的小白，到现在可以去写页面，交互，做项目，说实话，一对比有很大的进步，虽然进步不能说有多大，但真的是感觉这两个月

原创 第一次项目感悟

都说万事开头难，确实如此，在假期里我们开始了第一个项目，之前一直听学长学姐们说，在做项的时候我们能学到更多的东西，现在轮到我们自己做项目，感受尤为深刻，原来一个人奋战变成一个团队的合作，内心有点激动，第一次接触，项目中很多东西是第一次见，第一次听说，内心很好奇，我要慢慢去发现新大陆，我试着第一次用thymleaf写页面，写出来之后很成就感，在交互过程中，有的时候敲了好长时间，费了好大劲，代码写了很长，但最后效果没有实现，代码改了一次又一次，但是页面总是报错，一次次的尝试一次次失败，花了好长时间找bug，依旧

原创 近期感悟（7月25）

@帮志愿活动： 近期我有幸成为信息工程学院@帮活动的一名志愿者，内心有点激动，无数次幻想着以一个不同的身份站上讲台去亲近这些小朋友，但并不止是以一名老师的身份，也是与他们一起打闹，一起学习，无话不说的知心大姐姐，是他们的良师，更是益友。临时通知，由于疫情的原因，最终确定活动为线上开展，起初，我们内心有点些许的失落，但这并不会影响我们对志愿服务的那份热爱，线上开展，意味着我们需要更加细心，更加用心地去准备每一次直播，录每一个视频，我们可能会面临很多的困难和挫折，但这些都不是问题，因为我...