- 博客(37)
- 收藏
- 关注
RSS订阅原创 vue3使用el-breadcrumb开发面包屑导航组件
<template> <el-breadcrumb class="app-breadcrumb" separator="/"> <el-breadcrumb-item v-for="item in levelList" :key="item.path" :to="item.path"> {{ item.meta.title }} </el-breadcrumb-item> </el-
2022-05-25 17:01:21
1554
原创 element下拉树选框做筛选
由于自定义下拉树选框自定义筛选事件后更改了原数组的值/** * 过滤树节点 */filterNode (value, data, node) { if (!value) return true const _array = []; // 这里的数组存储，只是为了存储值 this.getReturnNode(node, _array, value); let ressult = false; _array.forEach(item => { result = result || i
2022-05-24 18:30:35
401
原创 element使用两个日期选择器做联动效果
原因：element-ui官网上的两个日期选择器并不好用，两个连到一起用户体验不理想实现效果/** html代码 **/<div class="choiceTime"> <el-date-picker v-model="startTime" type="date" value-format="yyyy-MM-dd" :picker-options="startNoTime" placeholder="选择
2021-05-07 14:42:54
2241
原创 element-ui更改树形控件图标的颜色
直接上代码// 更改指标树图标颜色.el-tree .el-icon-caret-right:before { color: #4A5879; /** 这里是要修改图标的颜色 **/}.el-tree-node__expand-icon.is-leaf::before { display: none; /** 当控件没有子节点时让图标消失 **/}...
2021-04-29 14:16:58
1712
原创 几道常见的JavaScript面试题
问题1：下面这段代码，浏览器控制台上会打印什么？答案：使用var关键字声明的变量在JavaScript中会被提升，并在内存中开辟空间，由于没有赋值，无法定义数值类型，所以分配默认值undefined。var声明的变量，真正的数值初始化，是发生在你确定赋值的位置。var声明的变量是函数作用域的，也就是我们需要区分局部变量和全局变量，而let和const是块作用域的。所以我们这道题的运行过程是这样的：所以答案是：undefined问题2:如果我们使用 let 或 const 代替 var，
2021-03-26 08:15:30
274
4
原创 vue视图不更新解决方法，3.0与2.0的区别
vue数组属性发生改变时，视图不更新如何解决data中数据，都是响应式。也就是说，如果操作data中的数据，视图会实时更新； 但在实际开发中，若data中数据类型较为复杂，方法methods中改变对象的属性，视图也就是页面并不会改变 原因是vue监听不到数据类型特别复杂的属性。 原因：因为 vue 的检查机制在进行视图更新时无法监测 数组中的某个对象的属性值的变化。1，使用this.$set(this.obj,key,val) 来解决对象操作： 三个参数：this.$set
2021-03-23 21:22:46
2760
2
原创 浏览器对象BOM
1，BOMBOM提供了独立于内容而与浏览器窗口进行交互的对象。BOM缺乏标准，javaScript语法的标准化组织是ECMA，DOM的标准化组织是W3C由于BOM主要用于管理窗口与窗口之间的通讯，因此其**核心对象是window**所有浏览器都支持 window对象。它表示浏览器窗口，是BOM的顶层（核心）对象，所有对象都是通过它延伸来的2，window的五大对象所有 JavaScript 全局对象、函数以及变量均自动成为 window 对象的成员。全局变量是 window 对象的属性。全局
2021-03-21 21:12:02
378
6
原创 文档对象模型DOM
由于vue react 框架的应用广泛，封装好了DOM操作，但是还是要熟悉的1，DOM的本质：DOM可以理解为浏览器把拿到的html代码，结构化一个浏览器能识别并且js可操作的一个模型当网页被加载时，浏览器会创建页面的文档对象模型javascript能改变页面中的所有HTML元素javascrip能改变页面中的所有HTML属性javascrip能改变页面中的所有CSS样式javascrip能对页面中的所有事件做出反应DOM是哪种数据结构树（DOM树）DOM树形结构2， js获取DO
2021-03-21 20:56:24
296
6
原创 event loop 事件轮询机制
1，event loop（事件轮询/事件循环）首先我们要知道 由于js是单线程的脚本，异步事件要基于回调来实现的而event loop 就是异步回调的实现原理1，js的执行顺序从前到后，一行一行执行如果有一行执行报错，就会停止下面代码的执行先执行同步代码，后执行异步举个例子这上面是一个js执行顺序的小案例上面是浏览器运行首先运行第一行代码，显示console.log(‘Hi’)，然后清空调用栈。然后调用函数，函数会进入异步函数队列中最后执行log代码，然后清空然后
2021-03-21 19:49:28
680
3
原创 javascript同步，异步的区别，Promise的使用
1，什么是同步，异步在我们学习的传统单线程编程中，程序的运行是同步的（同步不意味着所有步骤同时运行，而是指步骤在一个控制流序列中按顺序执行）。JavaScript的单线程浏览器脚本语言，JavaScript的主要用途是与用户互动，以及操作DOM。而异步的概念则是不保证同步的概念，也就是说，一个异步过程的执行将不再与原有的序列有顺序关系。为了利用多核CPU的计算能力，HTML5提出Web Worker标准，允许JavaScript脚本创建多个线程，但是子线程完全受主线程控制，且不得操作DOM。
2021-03-18 19:55:11
166
1
原创 作用域和改变this指向
1，作用域和自由变量作用域代表了一个变量的合法范围，一个变量的作用域是程序源代码中定义的这个变量的区域。1，全局作用域不在任何函数内声明的变量（函数内省略var的也算全局）称作全局变量就是在最外层定义的变量就被称为全局变量，全局都可以使用，所以是全局作用域。2，局部作用域在函数内声明的变量具有函数作用域，属于局部变量，就是在函数内部定义的变量，只在函数内部有用，所以是局部作用域。3，ES6的定义的块级作用域声明变量的方法 有var let constvar 声明的变量可以变量提升
2021-03-17 20:18:38
331
3
原创 vue高级特性的个人理解
1， vue如何使用自定义v-model有些情况我们要使用自定义v-model来实现数据的双向数据绑定，就要来自定义// 父组件<template> <div> <p>{{ val }}</p> //要展示的数据 <inp v-model="val" ></inp> //自定义组件 </div></template><script>import inp from "../
2021-03-16 22:06:33
226
1
原创 vue一些考点的个人理解
1，vue为什么要使用key？因为vue是基于mvvm框架的一种语法。什么是MVVM呢，就是M（model数据）、V（view试图）、VM（viewModel控制数据的改变和控制试图）可以理解为vue是根据虚拟DOM树来创建真实的DOM的。就是根据模板生成一个js对象（使用createElement方法），根据这个js对象再去生成真实的DOM。所以为了区分虚拟DOM，就要使用key值来分辨虚拟的元素。key后面绑定的是唯一标识，是不会重复的，Vue 会尽可能高效地渲染元素,通常会复用已有元素
2021-03-15 21:55:08
164
1
原创 常见的javascript面试题
1，常见的数据类型的判断，深拷贝与浅拷贝详情见博主写的另一篇博客^_^2，"===" 与 “==” 的区别== 检查值相等, 允许类型转换:两个等号我们称为等值符，当等号两边的值为相同类型时比较值是否相同，类型不同时会发生类型的自动转换，转换为相同的类型后再作比较=== 检查值和类型相等， 不允许类型转换:三个等号我们称为等同符，当等号两边的值为相同类型的时候，直接比较等号两边的值，值相同则返回true，若等号两边的值类型不同时直接返回false3，## 垃圾回收机制js垃圾回收机制有
2021-03-14 20:41:24
194
7
原创 CSS常见面试题
1，盒模型宽度的计算1，什么是盒模型所有HTML元素可以看作盒子，在CSS中，"box model"这一术语是用来设计和布局时使用。CSS盒模型本质上是一个盒子，封装周围的HTML元素，它包括：边距，边框，填充，和实际内容。盒模型允许我们在其它元素和周围元素边框之间的空间放置元素。2，盒模型分为标准盒模型和怪异盒模型box-sizing: content-box;标准盒模型是默认值，width是内容宽度 ，元素真正的宽度计算时要加上border（边框）和padding（内边距） box-s
2021-03-14 19:43:26
117
原创 JS面试要注意的问题
1，其实基础程序员面试就是考察你的基础知识但是前端面试题会有很多，多到你看不完那种，我们就可以从中间总结题面上的关键字举个例子typeof() 是判断什么js类型的？这个题第一是查看typeof 是怎么使用的，但是就可以从中间引出JS的数据类型：就是JS的基本数据类型和引用数据类型，又可以扩展出栈内存和堆内存，深复制和浅复制，如何使用递归...所以我们看到题就要去思考，看他出的题，然后可以聊朝你掌握熟练的地方引导，这样就可一掌握主动。2，几个常见的面试题1，发送url 到页面加载发生了什
2021-03-13 21:18:54
144
原创 微信小程序的Promise封装wx.request函数
1，为什么要封装wx.request封装wx.requset可以更有效的管理后台接口，更改更方便，更有利于项目的维护2，首先在项目文件夹utils里面创建request.js的文件夹里面封装我们想要的代码封装有两种方法可以使用，第一种是基于common.js封装成块来引入，第二种是基于ES6的封装，也可以使用在创建好的request.js文件里封装const request = (url,method,data)=>{ let baseURL = "基本路径"+url; /
2021-03-12 08:18:25
314
原创 事件流的解释，事件冒泡与事件捕获
1，什么是事件 事件是文档和浏览器窗口中发生的特定的交互瞬间，例如用户点击内容，鼠标经过特定的元素 以及按下某个键盘按键，web页面加载完成，用户滚动。都是事件2，什么是事件流 事件流描述的是从页面中接受事件的顺序，事件流分为事件冒泡 事件阶段 事件捕获 事件流分为事件冒泡流和事件捕获流 事件冒泡流 => ie提出的 事件捕获流 => 网景提出的 事件流三个阶段顺序 事件捕获 =>事件冒泡3，事
2021-01-29 14:51:51
332
1
原创 vue的生命周期函数
什么是生命周期函数每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做生命周期钩子的函数，这给了用户在不同阶段添加自己的代码的机会。1，beforeCreate( 实例创建之前 ) 在实例初始化之后，事件配置之前被调用，组件的选项对象还未创建 el 和 data 并未初始化，因此无法访问 methods，data， computed 等上的方法和数据2，cre
2021-01-22 08:01:21
238
原创 ajax异步请求
一、ajax入门1. 什么是ajax?ajax不是一种开发语言，它是在现有的js/html/css样式基础上，实现在不重新加载整个页面的情况下，与服务器进行简单的数据交互，通过js操作DOM进行页面局部更新.2. ajax的应用介绍：搜索建议，表单验证，点击下一页…3. ajax概念:Ajax 即“Asynchronous Javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。Ajax = 异步 JavaScript 和
2021-01-21 08:57:11
227
原创 性能优化的一些方法
1，前端优化的目的是什么 ?前端是庞大的，包括 HTML、 CSS、 Javascript、Image等等各种各样的资源。从用户角度而言，优化能够让页面加载得更快、对用户的操作响应得更及时，能够给用户提供更为友好的体验。从服务商角度而言，优化能够减少页面请求数、或者减小请求所占带宽，能够节省可观的资源。2，几种性能优化的方法1，减少http / axios 请求每个请求都是有成本的，既包含时间成本也包含资源成本。因此请求数多了以后，浏览器需要分批进行请求，因此会增加用户的等待时间。所以要合理
2021-01-19 20:08:44
1291
1
原创 sessionStorage、localStorage、cookie的区别
1. localStorage localStorage 生命周期是永久，除非手动清除localStorage 否则这些信息将永远存在。 存放数据大小为一般为5MB,而且它仅在客户端（即浏览器）中保存，不参与和服务器的通信var obj = { user: "李狗蛋", sex: "男", age: 18}//存储obj = JSON.stringify(obj)localStorage.setItem('obj', obj)//查看localStorage.getIte
2021-01-19 11:58:20
197
3
原创 promise的理解及使用、async的使用
1，promise是什么？是异步编程的一种解决方案，它比传统的回调函数加事件更加合理和强大。除了使用他的异步操作外，还使用promise在项目中解决了回调地狱等问题。promise也是一个构造函数。可以帮我们把异步操作队列化，按照顺序执行返回结果。自身上有all、reject、resolve这几个方法，原型上有then、catch等方法。就是将将异步操作以同步操作的流程表达出来，避免了层层嵌套的回调函数。但是使用实例化promise就会立即执行。promise可以将异步操作以同步操作的流程表达出来，
2021-01-16 20:14:47
639
原创 rem动态布局的原理及对设计稿的计算比例
1，rem的原理rem：是css的一个相对单位 相对于html根元素，可以通过监测屏幕大小改变html的字体大小从而实现自适应大小的效果，相对于根元素(即 html 元素)font-size 计算值的倍数。先按定高宽设计出来页面，然后转换为rem单位，实现完美自适应。例： a 标签的 font-size 值为 0.5rem，实际就是 100px*0.5 = 50px。关于像素的理解：“花森酱” 的博客2，什么是动态布局就是移动端项目适配不同的屏幕的大小，因为市场上手机有很多，屏幕大小也不同。
2021-01-14 21:39:45
2147
1
原创 js单线程--事件执行顺序，宏任务与微任务
1，js的代码执行顺序js引擎执行js代码的时候是单线程的，同一时刻只会有一个进程执行JS代码，多任务需要排队等候。JavaScript的单线程，与它的用途有关，作为浏览器脚本语言，JavaScript的主要用途是与用户交互，以及操作DOM。这决定了它只能是单线程，否则会带来很多复杂的同步问题。这种模式可能会阻塞代码，导致代码执行效率低下。为了避免这个问题，出现了异步编程，通过回调函数来实现异步代码的存放与执行。将所有的任务分为两种，一种是同步任务，一种是异步任务。同步任务：在主线程上排队执行
2021-01-14 21:09:45
596
1
原创 github的使用以及协同开发，sourcetree的使用
1，github 的个人理解这个网站就是提供 Git 仓库托管服务的，所以，只要注册一个 GitHub 账号，就可以免费获得 Git 远程仓库。本地 Git 仓库和 GitHub 仓库之间的传输是通过 SSH 加密的。创建SSH Key 秘钥ssh-keygen -t rsa -C “自己的邮件地址”,就会自己电脑C盘用户主目录中生成一个.shh文件夹id_rsa 是私钥，不能泄露出去， id_rsa.pub 是公钥，可以放心地告诉任何人。登陆 GitHub，打开“Account settin
2021-01-13 21:33:16
199
原创 判断数据类型的方法，深拷贝与浅拷贝的区别，原型的理解
1，Js数据类型分为基本数据类型和引用数据类型基本数据类型：number string undefined null boolean symbol 存放在栈中引用数据类型：object array function 值存储在堆中基本数据类型有固定大小和值，所以存在栈中，引用数据类型不确定大小，会把指针存在栈中，指向堆内存中的地址2，判断数据类型的方法下面是几种常用的方法：typeof()，用来判断基本数据类型，判断引用数据类型时，但是判断不出来array与object的
2021-01-13 20:08:26
198
原创 vuex的使用及五大核心
vuex是什么vuex是一个仓库，是vue的状态管理工具 状态指的就是数据，用于存放公共数据，任何组件都可以使用vuex里的公共数据使用场景：当有多个组件共享数据时，如果需要构建是一个中大型单页应用，使用Vuex就可以更好地在组件外部管理状态。vuex的五大核心 1， state ---存放Vuex store实例的状态对象，用于定义共享的数据。例如：state: { list: [], user:"", },//等同于vue的data，用来存储变量的。state
2021-01-12 19:50:36
397
1
原创 git的常用指令
git init创建一个git仓库，创建之后就会在当前目录生成一个.git的文件 初始化一个能让git进行管理的仓库git status可以查看当前git所处的状态，比如可以查看本次修改的内容，是否保存到本地仓库等…git add 向暂存区添加文件，用法: 例如： git add login.vue，就是添加单个文件到暂存区，也可以将全部的文件添加，用法： git add .git commit -m “描述” 对本次修改内容的描述，一次提交缓冲区的所有文件，可以将..
2021-01-12 17:05:44
69
转载 Vuex的五个核心属性及辅助函数介绍
本文转载"小鸡会蹦迪"，感觉博主写的不错，就转载了，地址：链接地址Vuex的五个核心概念本文参考自vue文档，说的非常详细，建议看文档。Vuex是什么？VueX 是一个专门为 Vue.js 应用设计的状态管理架构，统一管理和维护各个vue组件的可变化状态(你可以理解成 vue 组件里的某些 data )。Vue有五个核心概念， state, getters, mutations, actions, modules。本文将对这个五个核心概念进行梳理。总结store=> 类似容器，包含应.
2021-01-12 11:39:19
326
原创 vue实现循环单选效果
通过创建i变量来判断index下标控制实现动态效果，直接上代码：HTML以及JS逻辑代码：<ul class="uu"> <li v-for="(item,index) in arr" @click="i=index" :key="index" :style="[{background:item},{border:i==index?'3px solid purple':''}]"></li></ul> data() { retur
2021-01-12 10:56:13
539
原创 js的几种继承方式
构造函数的特点：封装， 继承， 多态 继承： 子类获取父类的属性和方法的过程1. 原型链的继承 让一个引用类型继承另一个引用类型的属性和方法//父级 //构造函数function Person(name,sex){ this.name=name; //属性 this.sex=sex; this.poop=function(){ //方法 console.log('hi') }} //原型 Person.prototype.hobb
2021-01-12 07:46:05
136
原创 闭包
概念当一个函数的返回值是另外一个函数,而返回的那个函数如果调用了其父函数的内部变量,且返回的那个函数在外部被执行,就产生了闭包例如：function fn() { var num = 1 // num 就是被闭包的变量 return function() { // 该返回函数就是闭包 num++ return num } }// return 后面
2021-01-11 21:37:00
311
1
原创 响应式布局如何实现
响应式布局可以让网站同时适配不同分辨率和不同的手机端，让客户有更好的体验。1， 百分比布局利用对属性设置百分比来适配不同屏幕，百分比是相对于父元素。能设置的属性有 width、height、padding、margin，其他属性比如 border、font-size 不能用百分比设置的2，使用媒体查询（css3 @media 查询）当前媒体查询可以监测的设备有 屏幕，打印机，屏幕阅读器Screen 屏幕 print打印机 speech 查询屏幕阅读器写法： @media scree
2021-01-11 21:33:15
572
3
原创 关于冒泡排序以及递归的理解
关于冒泡排序以及递归的理解就是将数组的数据循环并排序，重新组成新的数组，就是冒泡排序例如：//这里我们先定义一个随机数组var arr = [10000, 5888, 12000, 6999, 7000, 3000, 4500, 1200, 6000]//首先循环数组，来遍历每一项的值for(var i=0; i<arr.length; i++){ //再次遍历来判断前后两次的值 for(var j=0; j<arr.length; j++){ //当后面一个的值比前面值大
2021-01-11 17:04:11
409
3
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人