- 博客(42)
- 收藏
- 关注
RSS订阅原创 2024 前端高频面试题之 Vue 篇
Vue 自定义指令有全局注册和局部注册两种方式。先来看看注册全局指令的方式，通过方式注册全局指令。然后在入口文件中进行 Vue.use() 调用。它的作用价值在于当开发人员在某些场景下需要对普通 DOM 元素进行操作。提高代码复用。指令本质上是装饰器，是 vue 对 HTML 元素的扩展，给 HTML 元素增加自定义功能。vue 编译 DOM 时，会找到指令对象，执行指令的相关方法。自定义指令有五个生命周期（也叫钩子函数），分别是bindinsertedupdateunbind。
2024-01-20 11:55:58
10322
4
原创 2024 前端高频面试题之 浏览器原理 篇
为什么会有预检请求？1.浏览器限制客户端发起跨域请求2.跨域请求正常发起，但是服务器返回的结果被浏览器拦截一般情况下，跨域产生是第二种情况，服务器对数据已经进行了处理然而结果被浏览器拦截了，造成请求失败。所以为了避免这种情况，浏览器使用了HTTP的OPTIONS方法发起了一个预检请求，预检请求成功之后才会发起真实的带数据的请求，否则阻止。何种情况才会触发预检请求呢？CORS 分为两种请求：简单请求和非简单请求。简单请求1.GETPOSTHEAD请求2.text/plain3.
2024-01-19 17:51:39
1280
原创 2024 前端高频面试题之 JS 篇
① 所有引用类型都有一个__proto__(隐式原型)属性，属性值是一个普通的对象② 所有函数都有一个prototype(原型)属性，属性值是一个普通的对象③ 所有引用类型的__proto__属性指向它构造函数的prototype当访问一个对象的某个属性时，会先在这个对象本身属性上查找，如果没有找到，则会去它的__proto__隐式原型上查找，即它的构造函数的prototype，如果还没有找到就会再在构造函数的prototype的__proto__
2024-01-19 17:06:44
1950
转载 前端面试常用垂直居中布局
水平居中行内元素可设置：text-align: center;flex布局设置父元素：display: flex;垂直居中单行文本父元素确认高度：height === line-height多行文本父元素确认高度：disaply: table-cell;
2024-01-18 12:40:15
145
原创 2024 前端高频面试题之 HTML/CSS 篇
使用float布局两侧使用 margin 负值，以便和中间内容横向重叠防止中间内容被两侧覆盖，一个用padding为两侧留白 一个用margin为两侧留白。
2024-01-18 11:25:18
1696
转载 Github访问超时 or 连接不上解决方法（mac）
解析阶段会花费比较长时间。我们可以通过修改本地。文件，来绕过域名解析，从而达到加速访问的目的。服务器在国外，所以国内访问。
2024-01-18 10:17:46
166
原创 根据 vue-grid-layout 动态设置Echarts尺寸大小
此文背景是根据动态拖拽组件大小里面包含Echarts组件情景，也可以单独把监听动态设置Echarts尺寸抽离出来，以便方便大家食用，闲言少叙，直接上以上，就是程序猿本猿的动态设置Echarts尺寸大小实现方案，欢迎大家探讨学习。猛戳我。
2023-04-26 15:51:43
1319
原创 一起学Vue3源码，实现最简Vue3【08】 - 实现 reactive 和 readonly 嵌套对象转换功能
实现reactive 和 readonly 嵌套对象转换
2022-08-20 22:08:28
399
原创 一起学Vue3源码，实现最简Vue3【07】 - 实现 isReactive 和 isReadonly
实现 isReactive 和 isReadonly
2022-08-20 21:51:57
219
原创 一起学Vue3源码，实现最简Vue3【02】 - 实现 effect & reactive & 依赖收集 & 触发依赖
实现 effect & reactive & 依赖收集 & 触发依赖
2022-08-10 23:02:24
340
原创 一起学Vue3源码，实现最简Vue3【01】 - 初始化环境，集成jest，ts
本文编写初衷是分享、总结学习Vue3源码，实现一个最简Vue3。让我们一起开启Vue3学习之路。
2022-08-10 20:15:56
487
原创 Vue3学习（一）项目搭建
Vue3学习（一）项目搭建文章目录Vue3学习（一）项目搭建前言一、Vue3是什么？二、Vue3开发环境1.项目启动2.项目规范前言在目前的前端开发中，流行的框架相信你并不陌生。比如Angular、React、Svelte 等框架。作为入门相对简单的渐进式Vue框架，从此切入学习会更加得心应手。一、Vue3是什么？Vue 3 作为 Vue 框架最新的版本，有很多优秀的设计相信你会非常喜欢，例如 Composition 组合 API、基于 Proxy 的响应式系统、自定义渲染器等二、Vue3
2022-04-16 18:48:21
1283
原创 2021大厂字节跳动笔试题（含答案）
第一题[{num: 12, city: ‘beijing’},{num: 56, city: ‘shanghai’},{num: 167, city: ‘guangzhou’},{num: 23, city: ‘shenzhen’},{num: 45, city: ‘caoxian’}]写一个方法实现把上面的数组转换成下面这种格式：{beijing: 12, shanghai: 56,…}解析只要把数组遍历循环然后再向一个对象中插入就好了，代码如下：// 这里用的map，也可以用
2021-06-22 15:55:26
6694
转载 js 去掉首尾引号 & js 去除josn字符串中的全部转义字符 \
js 去除josn字符串中的全部转义字符 \:let jsonstr = "{\"message\":null,\"respData\":null,\"rspHead\":null,\"status\":\"success\"}";//正则表达式 匹配全部"\" 需要加 /glet reg = /\\/g;//使用replace方法将全部匹配正则表达式的转义符替换为空let replaceAfter = jsonstr.replace(reg,'');console.log("replaceA
2021-05-18 14:53:08
3087
转载 js遍历对象的几种方法
第一种： for…inconst obj = { id:1, name:'zhangsan', age:18 } for(let key in obj) { console.log(key + '---' + obj[key]) }输出结果：第二种：1）、Object.keys（obj）2）、Object.values（obj）参数：obj：要返回其枚举自身属性的对象返回
2021-05-14 11:30:07
260
转载 vue 遍历对象和遍历对象数组
1、遍历对象时,参数： 第一个为值，第二个为键名，第三个为索引<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="
2021-05-14 11:20:50
2441
转载 js 判断数字区间 是否有重叠
const list = [{ min: 111, max: 222}, { min: 333, max: 444}, { min: 333, max: 666}] if (list.length > 1) { list.forEach(item => { list.forEach(subItem => { if (item.min !== subItem.min || item.max !== subItem.max) { .
2021-05-14 11:10:06
1984
2
原创 Vue element ui el-autocomplete 模糊查询功能
需求：输入框，提供输入时模糊匹配事件名称，搜索不到时，可直接输入，且名字过长时，有文字提示话不多说，直接上代码：<el-table-column prop="attribute" label="属性"> <template slot-scope="scope"> <el-tooltip effect="dark" :disabled="scope.row.attribute.length <= 10" placement="top">.
2021-03-16 20:53:28
942
转载 将数组按对象某一属性值排序(number,字母，文字)
var array = [ { age: 20, name: 'lufy', cnName: '路飞' }, { age: 25, name: 'usop', cnName: '乌索普' }, { age: 12, name: 'tao', cnName: '涛' }, { age: 34, na
2021-01-21 18:19:10
304
转载 element tree模糊查询，筛选节点同时显示对应子节点
// 触发页面显示配置的筛选filterNode(value, data, node) { // 如果什么都没填就直接返回 if (!value) return true; // 如果传入的value和data中的label相同说明是匹配到了 if (data.label.toLowerCase().indexOf(value.toLowerCase()) !== -1) return true; // 否则要去判断它是不是选中节点的子节点 return this.checkBel
2021-01-11 15:37:57
621
原创 Vue+element循环表单验证
前情提示： 最近做项目，遇到提交表单中input循环检验，网上找了一些资料，最终整理一下如上图，动态点击生成或者删除input并且校验，闲言少叙，上代码：body部分：<el-form-item v-if="id === 3" label="Title Text" prop="title"> <div v-for="(item, index) in form.title" :key="index"> <el-form-item :prop="'tit.
2020-12-12 16:37:45
277
原创 switch case 优化
前情提示：前几天遇到代码里面switch case写的又长又臭，维护起来很麻烦，于是开始优化。看一下原来代码：看上去是不是很蠢，switch case里面还有一层switch case。严重影响可维护性。先设定一个函数，传进来id为1，2，3，4分别返回不同的值，下面说一下三种解决方案。let idswitch (id) { case 1: return 'a' case 2: return 'b' case 3: return 'c' case 4: .
2020-08-12 17:39:47
1058
原创 input框中按回车失去焦点
方法一：element-ui的input组件内部有input元素，可以给el-input设置ref属性，然后this.refs.input.refs.input.refs.input.el.querySelector(‘input’) 获取内部input属性从而调用blur事件，从而实现点击回车失去焦点。以上一篇文章为例，vue登录页面实现回车登录body：<el-input ref="input" v-model="personInfo.personId" placeholder="请
2020-07-30 12:54:44
3456
转载 onkeypress与onkeydown 事件区别详细说明
onkeypress 和 onkeydown 是有区别，下面将讲解 onkeypress 与 onkeydown 事件的区别。onkeypress 事件在用户按下并放开任何字母数字键时发生。但是系统按钮（例如：箭头键、功能键）无法得到识别。onkeydown 事件在用户按下任何键盘键（包括系统按钮）时发生。具体区别：1、 一个放开一个没有放开，onkeydown 先于 onkeypress 发生。2、onkeypress 无法系统按钮。3、onkeydown 捕获的 keyCode 不区分字.
2020-07-30 12:05:11
727
原创 vue登录页面实现回车登录
话不多说，直接上码：<el-form :model="personInfo" class="search-from" label-width="80px" @submit.native.prevent> <el-form-item label="卡号"> <el-input v-model="personInfo.personId" placeholder="请输入卡号" class="f
2020-07-30 11:57:39
483
原创 Vue表单提交点击事件只允许点击一次
常用出现场景：商城点击订单提交1、使用Vue封装事件body：<template> <div> <el-button @click.once="submitOrder()">提交订单</el-button> </div></template>方法：methods: { submitOrder() { // 处理逻辑 }}2、使用原生JS事件在数据data里面声明一个flag属性data() {
2020-07-28 17:22:11
2354
转载 var、let、const声明变量的区别
let和var声明变量的区别：1、let所声明的变量只在let命令所在的代码块内有效。（块级作用域）for(let i=0;i<10;i++){// ... }console.log(i);// ReferenceError: i is not defined上面的i只在for循环中有效，当在全局环境中去寻找时是找不到的，所以程序报错var a = [];for (var i = 0; i < 10; i++) {a[i] = function () {console
2020-07-28 15:26:09
205
转载 vue项目配置同一局域网可使用ip访问
1、检查 package.json文件，scripts.dev设置 host改成 "0.0.0.0"2、config文件中找到 index.js 文件的host改成 "0.0.0.0"此处的"0.0.0.0"可以改成自己的ip，重启项目就可以了转载自: https://www.cnblogs.com/angenstern/p/11542519.html...
2020-07-16 17:49:27
530
原创 element table下边线消失，以及左右边框不对齐
今天用element做表格的时候，碰见两个样式问题。问题如下图：问题：1、表格的下边线莫名其妙的消失了，之前也有做过，并未出现类似情况。2、表格左右边框不对齐解决：问题一：<style>// 表头的下边线添加.el-table th.is-leaf, .el-table td { border-bottom: 1px solid #EBEEF5; }// 表内容的下边线添加.el-table td, .el-table th.is-leaf {
2020-07-14 20:52:25
1515
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人