- 博客(61)
- 收藏
- 关注
RSS订阅原创 VUE09
1.EventBus注册在全局时，路由切换时会重复触发事件，如何解决？添加Bus.$off来关闭。beforeDestroy () { bus.$off('get', this.myhandle) },所以，如果想要用bus 来进行页面组件之间的数据传递，需要注意亮点，组件$emit事件应在beforeDestory生命周期内。其次，组件B内的$on记得要销毁。2.怎么修改Vue打包后生成的文件路径？使用vue-cli生成的项目，打包方式是直接执行package.json里配置的脚本
2022-05-30 10:38:48
256
原创 VUE08
1.说下$attrs和$listeners的使用场景。vue组件的数据通信方式很多，本篇着重讲$attrs/$listeners，神助是v-bind="$attrs"/v-on="$listeners。$attrs/$listeners的常用场景：封装第三方组件或者表单组件，从而减少组件处理成本。$attrs使用组件的时候，vue内部会将组件上面的属性，自动会合并到组件内部根元素上面。<template lang="pug"> list-item(a="a" b="b" c="c
2022-05-29 10:39:43
161
原创 VUE07
1.Vue给组件绑定自定义事件无效怎么做解决？你可能有很多次想要在一个组件的根元素上直接监听一个原生事件。这时，你可以使用 v-on 的 .native 修饰符：<label> {{ label }} <input v-bind="$attrs" v-bind:value="value" v-on:input="$emit('input', $event.target.value)" ></label>这时，父级的 .nati
2022-05-28 09:52:08
132
原创 VUE06
1，在vue事件中传入$event,使用e.target和e.currentTarget有什么区别吗？这个问题我觉得还是比较重要的，因为我们只要做过vue项目，基本会遇到这个问题。然而很多人是随便用，感觉都差不多，其实他们是有本质区别的，一旦没用好，随之扑面而来的就是bug。用概念区分：event.currentTarget始终指向事件所绑定的元素，而event.target指向事件发生时的元素。从上面的结果可以看出，不管你点击的是a本身或者a里面任何子集，currentTarget其获取到的对象都
2022-05-27 10:40:06
144
原创 VUE05
1.watch的属性用箭头函数定义结果会怎么样？不应该使用箭头函数来定义 watcher 函数 (例如 searchQuery: newValue => this.updateAutocomplete(newValue))。理由是箭头函数绑定了父级作用域的上下文。所以 this 将不会按照期望指向 Vue 实例，this.updateAutocomplete 将是 undefined。2.Vue项目如果methods方法用箭头函数定义结果会怎么样？最终结果是你怎么点都没反应，但并没报错，thi
2022-05-26 09:14:41
182
原创 VUE04
1.Vue渲染模板怎么保留模板中html的注释？在组件中将comments选项设置为true<template comments> ...</template>comments类型：boolean默认值：false限制：这个选项只在完整构建版本中的浏览器内编译时可用。详细：当设为 true 时，将会保留且渲染模板中的 HTML 注释。默认行为是舍弃它们。类型：boolean默认值：false限制：这个选项只在完整构建版本中的浏览器内编译时可用。详细：
2022-05-25 10:12:38
225
原创 VUE03
1.跟keep-alive相关的生命周期是那些？描述一下activated和deactivatedkeep-alive的生命周期1.activated： 页面第一次进入的时候，钩子触发的顺序是created->mounted->activated2.deactivated: 页面退出的时候会触发deactivated，当再次前进或者后退的时候只触发activated.2.Vue2.0兼容IE哪一个版本以上？在 Vue2.0 中完全 兼容IE 10 以上,部分 兼容IE 9,不支持
2022-05-24 11:00:04
442
原创 VUE02
1.怎么Vue定义全局的方法？一、将方法挂载到Vue.prototype上面缺点：调用该方法得时候没有提示//grobal.jsconst RandomString =(encode = 36 ,number = -8) =>{ return Math.random() //生成随机数，eg：0.1234 .toString(encode) //转化成36进制 ：“0，4fy” .slice(number) }, export
2022-05-23 10:37:55
230
原创 VUE01
1. vue的模板语法vue使用的是mustacheweb模板引擎，双花括号语法。模板引擎:负责组装数据，以另外一种形式或外观展现数据优点：1.可维护性（后期改起来方便）2.可扩展性（增加功能，增加需求方便）3.开发效率高（调试方便）4.观感好（不易写错）2 v-model的原理v-model就是vue的双向绑定的指令，能将页面上控件输入的值同步更新到相关绑定的data属性，也会在更新data绑定属性时候，更新页面上输入控件的值。v-model作为双向绑定指令也是vue两大核心功能之一，使用非常
2022-05-22 10:16:23
114
原创 前端剑解第五天
软技能：OPTION请求有什么作用?1 检测服务器所支持的请求方法。（比如：‘／user’路由支持哪些方法：get、post、delete…）2 CORS中的预检请求（检测某个接口是否支持跨域）,客户端使用XmlHttpRequest发起Ajax请求，当前绝大部分浏览器已经支持CORS方式，且主流浏览器均提供了对跨域资源共享的支持。JS：js如何做Error统计？前端异常包含很多种情况：1. js编译时异常（开发阶段就能排除）2. js运行时异常；3. 加载静态资源异常（路径写错、资源服务器异常、C
2022-05-15 10:18:07
476
原创 前端剑解第四天
软技能;304太多有什么影响？如果客户端发送了一个带条件的GET请求且该请求已被允许，而文档的内容(自上次访问以来或者根据请求的条件)并没有改变，则服务器返回一个304状态码。简单理解成：客户端访问服务器时，服务器已经执行了GET，但文件未变化。通俗点来理解：为了提高网站访问速度，服务器给访问过的某些页面设置了缓存机制。当客户端请求这些页面时，服务器将根据缓存的内容判断页面是否更新过，如果页面未更新过，它就会返回一个304状态码，这时客户端直接调用缓存的内容，而不必进行第二次调用及下载。综上所述，30
2022-05-14 10:03:33
188
原创 前端剑解第三天
软技能：http缓存策略http根据是否要向服务器发送请求将缓存规则分为了两类：强缓存和对比缓存（对比缓存也叫做协商缓存）强缓存直接从缓存数据库中取出资源，无需再发送请求到服务器上：http中用来判断是否命中强缓存的字段为Expires和Cache-Control，Cache-Control优先级高于Expires。强缓存状态码为200，但查看chrome的network会发现状态码后面多了个注释。对比缓存是需要经过服务器确认是否使用缓存的机制，其http状态码为304，意为not modifi
2022-04-10 09:29:51
164
原创 前端剑解第二天
软技能：前端数据回显数据回显就是当用户数据提交失败时，自动填充好已经输入的数据。对于简单数据类型，如：Integer、String、Float等使用Model将传入的参数再放到request域实现显示。 @RequestMapping(value="/editItems",method={RequestMethod.GET}) public String editItems(Model model,Integer id)throws Exception{ //传入的id
2022-04-09 09:50:22
258
原创 前端剑解第一天
html：前端如何高性能渲染十万条数据？有什么方法？对于一次性插入大量数据的情况，一般有两种做法：时间分片虚拟列表最粗暴的做法，一次性将大量数据插入到页面中：<ul id="container"></ul>// 记录任务开始时间let now = Date.now();// 插入十万条数据const total = 100000;// 获取容器let ul = document.getElementById('container');/
2022-04-08 10:47:36
1148
原创 前端面试算法题
1. 数组扁平化 .数组是 JS 中使用频率仅次于对象的数据结构，官方提供了众多的 API。今天我们来谈谈如何扁平化（flatten）数组。扁平化就是将嵌套的数组变成一维数组的过程。通常有几种方法可以实现扁平化：第一个就是迭代递归法var array = [[1,2,3],4,5,6,[[7]],[]]var result = flatten(array)console.log(result)for…of 实现function flatten(arr, result = []) {
2022-03-19 17:07:45
4552
原创 VUE面试题答案
单页应用spa/多页应用SPA（single-page application），翻译过来就是单页应用SPA是一种网络应用程序或网站的模型。它通过动态重写当前页面来与用户交互，这种方法避免了页面之间切换打断用户体验。在单页应用中，所有必要的代码（HTML、JavaScript和CSS）都通过单个页面的加载而检索，或者根据需要（通常是为响应用户操作）动态装载适当的资源并添加到页面页面在任何时间点都不会重新加载，也不会将控制转移到其他页面。我们所熟悉的js框架react，vue等等都SPA页面。多页应
2022-03-18 11:40:30
1651
原创 JS面试题-答案
1. 数据类型（基本类型/引用类型）基本类型：字符串（String）、数字(Number)、布尔(Boolean)、对空（Null）、未定义（Undefined）、Symbol。引用数据类型：对象(Object)、数组(Array)、函数(Function)。（数组和函数都是属于对象的数据类型）console.log(typeof NaN) // numberNaN是一个数值类型（number）,但不是一个具体数字null和undefined区别：null会被隐式转化为0，不容易发现错误，
2022-03-17 17:50:23
2985
1
原创 css面试题answer
1. 介绍一下css盒子模型CSS盒模型本质上是一个盒子，封装周围的HTML元素。它包括：外边距（margin）、边框（border）、内边距（padding）、实际内容（content）四个属性。CSS盒模型：标准模型 + IE模型。其中标准：怪异ie：标准盒模型：盒子总宽度/高度 = width/height + padding + border + margin。（ 即 width/height 只是内容高度，不包含 padding 和 border 值 ）IE盒子模型：盒子总宽度/
2022-03-16 17:45:35
206
原创 html面试题answer
1，行内元素和块级元素。块级元素:占据父容器宽度整个空间，所以创建一个块。其前后另起新行，只在body。不接受任何元素并列，可以设置宽，可以容纳内联元素和其他块元素。行内元素：display inline，也叫内联元素，只占据对应标签边框的空间。可以与其他行内元素并排，不可以设置宽高，设置lineheight才可以水平有效。通过设置inlineblock，融合其优点，通过设置父fontsize0，设置子fontsize消除间隙。（1）行内元素有：<a> <b> <
2022-03-16 15:35:45
165
原创 VUE面试题
vue高频面试题：单页应用spa/多页应用MVVM（render函数 响应式 如何解析模板）vue的响应式原理（数据双向绑定）data为什么是函数（什么时候可以使用对象）v-model的原理v-if和v-showcomputed，watch，methodvue生命周期父子组件生命周期执行顺序vue组件之间通信方式vue的单向数据流keep-alive组件（利用keep-alive实现快速页面缓存）slot卡槽vue检测数组和对象（vue.set()）vue里key的作用vu
2022-03-16 09:03:44
67
原创 JS面试题
js高频面试题：数据类型（基本类型/引用类型）判断变量类型数据类型转换（== && ===，强制转换和隐式转换）原型和原型链闭包（内存泄漏）call，apply，binddom事件流和事件委托cookie和storge（本地存储）数组和对象常见方法new对象时内部做了什么防抖，节流实现动画的方式（requestAnimationFrame）this指向作用域链let、var、const异步编程promise和asyno await箭头函数js的运行机制
2022-03-15 18:06:10
337
原创 css面试题
css高频面试题：介绍一下css盒子模型BFC清除浮动的方法position属性css隐藏元素的方式（display和visibility）Flex布局css选择器css3动画（GPU加速）css实现三角形和扇形0.5px的线和椭圆css Spriteepx rem em伪类/伪元素预编译css（stylus/sass/less区别）还是老规矩，明天给答案！...
2022-03-15 17:55:07
272
原创 HTML面试题
html高频面试题：行内元素/块级元素 替换元素/非替换元素img标签的alt和titlemeta标签DOCTYPE标签：标准模式/兼容模式js延迟加载的6个方式（包括script标签的defer和asys）重排和重绘引入css样式方法区别href和src定义和区别创建dom元素方法双栏布局和三栏布局水平垂直居中的方法以上就是高频面试题，明天给出答案！...
2022-03-15 17:48:22
290
原创 面试准备内容
面试题型：1， html&& css2，javascript3，vue/react二选一4，算法-剑指offer60题5，1-2项目6，计算机网络+基本命令.其中面试有一面二面三面：一面：自我介绍+前端基础（htmlcssjs）+常见算法+还有什么问的二面：自我介绍+项目提问+框架计算机网络指令+常见算法+还有什么问的吗三面：自我介绍+兴趣爱好+公司了解+还有什么问的吗。其中自我介绍（一面+二面）：问好介绍+技术成长经历+总结+礼貌结尾其中自我介绍（三面）：问好介绍+
2022-03-15 17:41:35
1116
原创 面试文章推荐+vue父子+vuex
https://juejin.cn/post/7061588533214969892#heading-91面试介绍推荐一个面试经验，觉得讲的挺透彻的。除此之外还有自己的内容自己补充一下。第一个：vue父子组件信息传递首先是：父传子：是通过属性的方式 传值，传的值可以是任意类型，甚至可以是父组件的方法或者父组件对象本身。在父组件中引入子组件；并在components中注册子组件；.通过属性向子组件中传值。<template> <div> &l
2022-03-12 16:51:19
1025
原创 es6面试
1，const 和 letlet: 声明在代码块内有效的变量。特点：在存在变理提升（不能在变量声明之前使用）let的暂时性死区： 其实与1差不多，只要在块作用域有声明，就不能在本作用域声明前用主个变量。不允许重复声明。const: 声明一个只读的常量特点：一但声明，这个值不能被改变（对于引用类型，是引用的地址不能被改变）声明时必须赋值（附：其实面试中常会问到var let const 三个的区别，回答的时候注重各自的特点。其实const let就是弥补var 的各种缺点（没有块级作用域
2022-03-12 16:26:40
1104
原创 vue生命周期函数详解
vue生命周期：「创建期间的生命周期函数：」1.1 beforeCreate：实例刚在内存中被创建出来，此时，还没有初始化好 data 和 methods 属性。也就是说，如果这个时候要使用data或者是methods会在控制台报错。1.2 created：实例已经在内存中创建OK，此时 data 和 methods 已经创建OK，此时还没有开始 编译模板。也就是说;这里从描述中可以知道以下几点：处理data中的参数，例如：变更、修改、读取等等处理methods中的方法，例如：执行方法
2022-03-12 15:54:26
225
原创 面试流程：小天才步步高
春招笔试：单选：html内联 css选择器 vue的绑定事件 vue生命周期 vue的父子传值多选：数据结构 的队和栈特点，很简单。简答：osi七层模型和tcp/ip四层模型浏览器url发生的过程前端优化的常用方法编程题：div盒子，垂直水平居中，高度为宽度一半。防抖和节流函数编写。简答：1 ，OSI定义了网络互连的七层模型（物理层、数据链路层、网络层、传输层、会话层、表示层、应用层）应用层：为应用程序或用户请求提供各种请求服务。表示层：数据编码、格式转换、数据加密会话层：
2022-03-12 10:31:38
1046
原创 React及其基本使用
React 是一个用于构建用户界面的JavaScript库，使用 React 可以将一些简短、独立的代码片段组合成复杂的 UI 界面，这些代码片段被称作“组件”。特点：Declarative 声明式： 以声明式编写UI，让代码更加可靠且方便调试Component-Based 组件化： 创建拥有各自状态的组件，再由组件组成更加复杂的UI。Learn Once, Write Anywhere 一次学习，随处编写：无论什么技术栈，无需重写现有代码，引入React即可开发新功能，同时还可以进行服务器端渲染。
2022-03-09 21:00:01
374
原创 Vue第一次使用
Vue.js（读音 /vjuː/, 类似于 view） 是一套构建用户界面的渐进式框架。Vue 只关注视图层， 采用自底向上增量开发的设计。Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。创建第一个vue：环境：vscode打开终端：安装好node.js，安装npm,以及镜像cnpm国内：查看yarn环境：安装vue脚手架：cnpm install -g @vue/cli查看版本并且创建vuedemo01项目：进入目录：启动服务cd vued
2022-03-08 17:03:22
670
原创 web服务器ngix基础
Nginx (发音为[engine x])专为性能优化而开发，其最知名的优点是它的稳定性和低系统资源消耗，以及对并发连接的高处理能力(单台物理服务器可支持30000～50000个并发连接)。ngix 是一个高性能的 HTTP 和反向代理服务器，也是一个IMAP/POP3/SMTP 代理服。nginx相对于apache的优点：1 轻量级，同样起web 服务，比apache占用更少的内存及资源 ，支持更多的并发连接，体现更高的效率，这点使 Nginx 尤其受到虚拟主机提供商的欢迎。在高连接并发的情况下，N
2022-03-08 11:31:06
159
原创 测试mock基础
mock是在测试过程中，对于一些不容易构造/获取的对象，创建一个mock对象来模拟对象的行为。比如说你需要调用B服务，可是B服务还没有开发完成，那么你就可以将调用B服务的那部分给Mock掉，并编写你想要的返回结果。Mock简单来理解，就是在测试过程中，对于某些不容易构造或者不容易获取的对象，用一个虚拟的对象来创建以便测试。而这个虚拟的对象就是mock对象。mock对象就是真实对象在调试期间的代替品。就Mock功能而言，本身适用场景较多，但在实际项目中，引入Mock常用来解决的几类，概括起来，主要有：
2022-03-08 10:37:41
601
1
原创 CSS模块化 SASS基础
为什么我们要使用模块化开发呢？因为日常的开发模式 存在以下痛点。全局污染：CSS 选择器的作用域是全局的，所以很容易引起选择器冲突；而为了避免全局冲突，又会导致类命名的复杂度上升复用性低：CSS 缺少抽象的机制，选择器很容易出现重复，不利于维护和复用。当然，对于这个问题，也有一些方案。 vue 框架已经帮我们实现了 css 模块化, 通过 style 标签的 scoped 指令定义作用域，通过编译为该作用域所有标签生成唯一的属性。SASS（英文全称：Syntactically Awesome St
2022-03-08 10:30:28
444
原创 BootStrap入门
Bootstrap 是目前最流行的一套前端开发框架，集成了 HTML、CSS 和 JavaScript 技术，为网页快速开发提供了包括布局、网格、表格、按钮、表单、导航、提示、分页、表格等组件。即使你只会html和css和js，也可以轻轻松松做出简单美丽的布局。Bootstrap 是最受欢迎的 Web 前端框架之一，用于开发响应式布局、移动设备优先的 Web 项目。为什么这么受欢迎呢？Bootstrap 出自 Twitter由大公司发布，并且完全开源，自然久经考验，减少了测试的工作量。这也就是
2022-03-07 16:21:56
246
原创 nodejs 包管理npm yarn npx
NPMnpm是 Node.js 官方提供的包管理工具，他已经成了 Node.js 包的标准发布平台，用于 Node.js 包的发布、传播、依赖控制。npm 提供了命令行工具，使你可以方便地下载、安装、升级、删除包，也可以让你作为开发者发布并维护包。 npm 之于 Node.js ，就像 Maven之于java，pip 之于 Python， gem 之于 Ruby， pear 之于 PHP 。 npm是一个前端包管理工具，就像java中的maven一样，只需要简单配置(dependencies和d
2022-03-07 15:45:07
679
原创 前端 研发流程
1 领导或甲方提出需求，评审需求；2 根据需求画出原型图，评审原型图；3 技术实现评审，进行排期，开始开发；4 技术选型；5 项目架构搭建；6 根据原型图出效果图，评审效果图；7 前端根据效果图绘制静态页面；8 与后端对接接口；9 本地自测；10 发布测试环境，提测；11 bug反馈，反复修改与修正；12 部署上线；具体步骤：（一） 立项领导或甲方提出需求，评审需求；产出：立项申请书（二）需求确认根据需求画出原型图，评审原型图；产出：原型图，功能清单，需求说明书（三）工
2022-03-07 12:02:20
2297
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人