自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(35)
  • 收藏
  • 关注

原创 代码实现vue的双向绑定(二):解析器和MVVM

上文已经实现了双向绑定的数据劫持、订阅者和发布者,接下来要继续实现双向绑定中的解析器,以及 Vue 这样的 MVVM 框架如何搭建。

2022-03-05 17:01:57 542 1

原创 代码实现vue的双向绑定(一):订阅者和发布者

参看相关文章以及 vue 源码,自己去实现 vue 的双向绑定的观察者模式

2022-03-05 16:56:10 1203

原创 ElementUI 避免出现多个message同时出现

element ui 避免多个提示框同时出现

2022-01-06 11:31:41 1301

原创 Nuxt 根据用户身份跳转不同页面(路由)

场景需要根据用户登录的账号角色跳转不同的页面即路由,比如分为正式账号和演示账号。解决方法1. 在每个页面使用来区分坏处就是页面区分的太散乱,后期维护的成本较大2. 使用中间件middlewarea. 在 middleware 下新建demo.jsexport default function ({ isServer, req, redirect, route }) { let url = process.env.NODE_ENV === 'public' ? 'xxxx' : 'xx

2021-04-28 20:37:06 750

原创 在 Nuxt中使用滚动组件 vue-seamless-scroll

在公司基于Nuxt项目中需要使用滚动组件,刷新之后会报错window is not defined1. 安装 vue-seamless-scrollnpm install vue-seamless-scroll --save2. 更改配置文件报错 window is not defined,是由于nuxt是基于服务器渲染的框架,服务器渲染时没有wiindow定义的。VUE报错:客户端呈现的虚拟DOM树与服务器呈现的内容不匹配。这可能是由不正确的HTML标记引起的,例如在其中嵌套块级元素或丢失。在

2021-04-26 10:46:05 1637

原创 项目中修改Element-ui组件的默认属性

在一个项目中如果要修改element-ui中的某个组件的默认值又不想一个个组件修改,可以在配置element-ui的地方修改组件某个属性的默认值。import Vue from 'vue'import ElementUI from 'element-ui';// 修改input组件默认有清空按钮ElementUI.Input.props.clearable.default=true;Vue.use(ElementUI);并不是所有组件的属性都可以通过这样的方式修改,必须在代码配置有deful

2021-04-25 14:54:46 1784

原创 vue+elementui el-select选择框异步请求选项列表,$set之后显示的value值

场景两个el-select 联动的选择框,选完第一个框异步加载第二个框的选项列表并给第二个选项赋值为选项的第一个值<template> <el-select v-model="formData.data1" @change="onChange" > <el-option v-for="item in option1" :key="item.id" :l

2021-04-23 17:52:50 3445 1

原创 微信小程序下拉菜单组件实现

先看需求和效果,移动端设计比较常用的下拉菜单,主要用于筛选查询列表结果。下拉菜单的样式可以根据自己的具体需求进行修改。这里根据自己的实际需求开发了三种下拉类型:第一个是单选下拉菜单,单选之后立即收起。第二个是复选下拉菜单,主要提供了多选的功能,显示确定和重置按钮用于修改复选结果。第三种是自定义内容,提供给用户自己写组件内容的插槽。代码的详细解释就不用说了,直接上代码片段,可以在微信开发者工具中查看效果和代码。我在小程序开发的过程中也开发了许多组件,可以在我的gitee地址中去查看,所有组件的

2021-04-12 17:30:22 5436

原创 Nuxt中keep-alive的使用

layouts/default.vue<nuxt keep-alive :keep-alive-props="{include: includeArr }"/><script> export default { data() { return { includeArr: [ 'ServicerManageProjects', 'DataReportData', ]

2021-04-12 17:29:22 563

原创 微信小程序-wx.openDocument常见报错总结

小程序开发中用wx.openDocument()遇到了几个常见的问题,做下总结downloadfile:fail url not in domain list详细原因点击查看原文,上传时一定要配置 详情->域名信息 中的request合法域名 uploadFile合法域名 downloadFile合法域名,并且均为https。// 可根据版本判断是否替换成httpsurl.replace("http:","https:")FAIL FILETYPE NOT SUPPORTE

2020-10-30 19:12:13 6548

原创 微信小程序-ios设备下new Data()方法显示NAN

问题描述小程序开发过程中,发现 Android 设备可以正常的显示时间,而 iOS 设备无法正确的显示。原因iOS 系统对 JavaScript 中的 new Date() 方法有严格的格式要求。IOS 系统的格式如下:let now = new Date("2020/10/30 00:00") 解决方法通过replace方法替换let date = "2020-08-08 00:00"let now = new Date(date.replace(/-/g,'/'))...

2020-10-30 18:20:31 305

原创 微信小程序-带参数分享的公有方法

需求说明微信小程序每个页面分享给朋友的时候,如果分享的链接里不带参数。那么在onLoad: function (options)中就会识别不了参数导致页面无数据渲染或者报错无法打开。所以需要一个全局分享方法,解决方法我看了很多文档,有的是在app.js中使用wx.onAppRoute来监听路由切换,设置每一个page的onShareAppMessage方法间接实现全局设置分享内容。官方文档没有这个api并且自己尝试了一下没用,如果各位试的有效果可以跟我说一声,学习一下我自己就写了个分享当前页面的公有

2020-10-28 19:38:50 1699

原创 微笑小程序 1px边框border

像素基本概念: 参考这篇文章微信小程序----适配小结、移动端1px与选择器权重,里面已经很清楚的描述了像素单位及为什么会出现CSS写的1px,实际上看起来比1px粗。直接上代码:/* border 1px样式 */.border_bottom, .border_top, .border_all { position: relative;}.border_top::after { position: absolute; content: ''; width: 100%; l

2020-09-27 16:17:54 1079

原创 微信小程序连接WiFi

微信小程序连接WiFi需求说明代码及说明1. 系统判断2. 权限判断及申请3. 搜索wifi列表并连接3. 切换不同wifi时进行提示需求说明小程序搜索附近能连接的wifi并出现列表点击wifi进行连接切换不同wifi时进行提示代码及说明对于需求只贴上js部分代码,用于记录小程序连接wifi接口使用及遇到的问题。具体API查看微信官方文档。微信官方文档1. 系统判断说明: 因为获取wifi列表根据官方文档所示ios将跳转到系统设置界面,因为界面操作不统一,所以这次先不对ios设备进行适配

2020-09-27 15:37:54 8976 4

原创 var let const的区别和用法

面试的时候这三个定义变量和函数的方法没有解释清楚,今天把他们总结清楚。只要搞清楚全局作用域、函数作用域和块级作用域。参考资料全局作用域和函数作用域块级作用域全局作用域这个比较好理解,就是定义在script里面的变量和函数,可以在任何地方访问到。函数作用域调用函数的时候会创造一个函数作用域,需要注意的是只有调用函数的时候才会创造,函数在定义的时候是不会创造作用域的。块级作用域块级作用域是ES6才定义的。最简单的理解是{ }中间的部分是一个块级作用域”。例如:for 循环、 if

2020-05-11 22:23:34 304

原创 前端面试必考——JS闭包

闭包是前端面试的时候,必然会问到的问题。码龄一年的我在实际应用的时候还没有应用到。但是先搞定面试先。等以后开发经验再多一点的时候,再加更多的理解吧。闭包: 内部函数总是可以访问其外部函数的参数和变量其实理解这句话要先理解js的变量作用域,函数内部可以直接读取全局变量,但是在函数外部是不可以读取函数内的局部变量。所以需要闭包来访问函数内部的变量。function outerFunc() { var name = "内部函数变量"; function innerFunc() { .

2020-05-08 22:36:09 291

原创 Js深拷贝和浅拷贝及相关知识点

不管是实际应用还是面试当中,js的深拷贝和浅拷贝的区别一直都是最常遇到的问题,今天花点时间彻底搞定它。相关知识点1. js两种不同的数据类型基本类型:String,Boolean,Number,Undefined,Null;引用类型:Object(Array,Date,RegExp,Function);两者最大的区别就是保存位置的不同,基本数据类型是保存在栈内存里;引用数据类型是保存...

2020-05-07 22:49:42 138

原创 纯前端多选表格table批量删除

在工作中对表格的数据进行删除,一般来说都是与后端进行联调。但是也会遇到这种情况,对表格删除操作的时候不需要与后台对接,在对表格数据进行删除后点击保存的时候才与后台对接。今天写这个功能的时候首先想的是两个for循环,这样写起来会代码会比较多且很复杂。抱着对简短优美代码的追求。handleDeleteSelection() { this.multipleSelection.forEac...

2020-03-05 20:39:41 1807 1

原创 优化代码:table中遇到将某一列代码转述成表述值

在工作中经常遇到一个场景,在表格数据与后台接口交互的过程中,某一列后台只会传一个code,但是实际上在表格上要展示的事code对应的描述值。// 后台传来的数据:tableData: [ { userName: '张三', typeCode: '1' }, { userName: '李四', typeCode: '2' } ], // 类型对应表 typeOption: [ ...

2020-03-05 00:15:31 109

原创 vue-element-ui 步骤条Steps限制已成功的步骤进行点击跳转

最近工作中使用到了element-ui中steps组件,需求是:步骤(数量)会因为某些条件进行变化对于已通过的步骤可以点击步骤进行跳转对于未通过的步骤鼠标要有禁止的提示因为原本组件是没有这些功能的,所以要自己对step进行优化。因为某个步骤下是分四个人做,所以步骤内容是以组件的形式分开上代码<template> <div class="main"> ...

2020-03-04 16:45:24 9421 1

原创 10.11 前端面试问题总结

1.跨域问题https://segmentfault.com/a/11900000111453642.浏览器兼容问题3.回调函数

2019-10-14 18:40:39 208

原创 10.10 前端笔试问题总结

1.垂直水平居中的方法1.js单链表类2.二进制里面1的数量3.字符串中数量最多的字符

2019-10-14 18:39:35 77

原创 10.9 前端面试问题总结

vue1.this.$ set是什么?有什么用?2.this.$ force update是什么?3.介绍mixin4.介绍directvuex1.介绍dispatch

2019-10-14 18:37:47 81

原创 9.21 前端面试问题总结

9.21 前端面试问题总结1.http协议原理 特性2.ajax原理ajax的原理ajax的工作原理3.js是单线程还是多线程4.js作用域链5.js原型链 原型6.js闭包应用场景7.对es6的理解8.vue-router两种模式区别1.http协议原理 特性http请求由请求和响应构成,是一个 无状态 的响应**(无状态是指web浏览器和服务器之间不需要建立持久的连接)**HTTP是一...

2019-09-28 22:23:53 112

原创 9.20 前端面试问题总结

9.20 前端面试问题总结CSS1.用CSS画三角形2.CSS画正方形的四个角(红色的线)3.margin设置为负有什么效果?可以实现什么?VUE1.vue组件之间通信的方法和原理?2.为什么要用到vuex?CSS1.用CSS画三角形已经单独写出来了:CSS画三角形主要就是用border来画三角形2.CSS画正方形的四个角(红色的线)这里要用到伪类:nth-child,平时经常遇到的...

2019-09-22 22:29:45 94

原创 CSS--画三角形

用CSS怎么画三角形最近面试经常被问到这个问题,专门写一个来解答一下。以下是参考资料:用CSS画三角形这个主要是画提示框纯CSS绘制三角形这个是各种角度的三角形主要要弄清楚三角形是怎么来的,在参考资料的第一篇也有讲:一个div的width和heigth都为0,只有border时会产生什么效果代码:<body> <div class="triangle"&...

2019-09-22 11:54:54 262

原创 9.19 前端面试问题总结

1.前端怎么优化?怎么防止跨站攻击?2.浏览器运行机制 js在哪里作用?3.解释什么是闭包?底层原理是什么?

2019-09-19 21:52:57 118

原创 9.17 前端面试问题总结

用js表达jquery1. $("</ div >")2. $("#content").html(“我是内容”)实现原理

2019-09-18 23:41:00 72

原创 9.12 面试基本问题总结(前端)

9.12面试基本问题总结基础1. 常见http请求码2.http请求方法有哪些基础1. 常见http请求码请求码说明401请求要求用户的身份认证404服务器找不到资源410客户端请求的资源已经不存在(资源以前有现在已经被永久删除,可301代码指定资源的新位置)500服务器内部错误,无法完成请求2.http请求方法有哪些菜鸟教程-http请...

2019-09-17 00:35:14 74

原创 9.10 前端面试题

HTML&CSS1.解释块元素和行内元素2.css中color值的写法JS1.闭包2.cookie?cookie的弊端?与storage的区别?3.json和jsonp的区别https://cloud.tencent.com/developer/article/14954154.http常见状态码以及其代表的含义https://blog.csdn.net/baidu_24...

2019-09-10 23:06:14 101

转载 JS笔试-作用域

function Foo() { getName = function () { console.log(1); }; return this; } Foo.getName = function () { console.log(2); }; Foo.prototype....

2019-09-04 11:36:00 157

原创 SCSS的基本用法

SCSS作为CSS的预处理器,是为了生成CSS。为什么要用SCSS,SCSS的好处是什么?1. 开发效率高。对于一些样式复杂的站点,用 SASS 之类的工具生成代码比手写 CSS 快得多2. 大型项目或者协同开发的时候,可以将css代码模块化3. 提高CSS样式的易维护性scss的基本用法参考这里...

2019-09-04 10:32:02 192

原创 JS中的防抖和节流

摘要防抖和节流是前端优化的一部分,可以防止过多的请求。在刚开始做项目的时候还没有意识到,但是到了企业级开发或者大项目开发的时候,要考虑防抖和节流。详细请参考js:防抖动与节流防抖怎么理解防抖其实是使某一函数(请求)在用户结束操作后的规定时间后再执行。应用场景比如在表单输入时一般要进行非空校验,如果没有防抖的话,会在用户每输入一个字符就执行一次非空校验。当有了防抖之后,可以使用户在停...

2019-08-30 19:53:37 194

原创 8.28 面试基本问题总结

8.28面试笔试1.浏览器的渲染机制是什么?2.什么是回流(reflow)重绘(repaint)?重绘Repaint回流Reflow3.简述BFCBFC块格式化上下文外边距折叠(Margin collapsing)1.浏览器的渲染机制是什么?详细理解:可以参看简述浏览器渲染机制;大概说出渲染流程,加上自己的理解。个人理解:当用户打开一个url之后,浏览器向服务器发出请求。HTML解析器会...

2019-08-29 22:05:29 282

转载 JS容易混淆的call、apply和bind方法

详情描述共同点都是用来改变函数的this的指向bind是返回对应函数;apply、call是立即调用call()定义:调用一个对象的一个方法,用另一个对象替换当前对象理解: method1.call(method2,num1,num2) = method1(num1,num2) 即用method1替换method2例子:function Animal(){ this....

2019-08-27 16:55:08 100

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除