- 博客(83)
- 收藏
- 关注
RSS订阅原创 vantUI上传文件组件uploader无法正常回显图片问题
VantUI中的uploader上传文件组件回显时，如果图片没有带特定的格式后缀，那我们需要加上一个isImage属性，告诉组件该资源为图片，才能正确渲染图片。
2023-04-18 15:35:51
2194
原创 微信小程序使用webview内嵌h5页面 wx.miniProgram.getEnv失效问题
微信小程序使用webview内嵌h5页面 wx.miniProgram.getEnv失效问题
2023-04-18 15:02:40
1165
原创 关于SwitchHosts的黑魔法记录
突然我灵鸡一动，想到同事用的都是mac，我用的是windows，会不会是系统问题，于是我自己把需要的一个host手动打入SwitchHosts里面，ping了一下直接成了，这班也不是不能上。这时候我们就要成为一名搜索引擎工程师了，cv不行，百度可不能不行，经过一顿查找方法并实践，各种方法都试了，最后还把软件给重装了，结果还是不行，这个班是一天都不想上了。当我因没配置host时，请求不到接口时，我喊来了同事帮忙，同事一顿操作，ping了一下接口，就发现host没配，直接给我甩了一个配置文档过来。
2023-04-17 11:51:25
217
原创 vue组件传值之$attrs、$listeners
组件传值总结props和emit：父子组件传值provide和inject：父子组件或者爷孙组件传值$parent,$root,$chidren:父子组件传值vuex事件总线(vue实例)$attrs、$listeners:父子组件传值前5种可能大部人都知道，这篇文章主要对$attrs、$listener进行一个介绍。$attrs、$listeners$attrs:官方文档介绍：包含了父作用域不作为prop被识别（且获取）的attribute绑定（class和style除外）。当一个
2022-05-02 17:47:09
2170
原创 js中获取DOM元素大小各属性
题记写这篇文章的背景还要从一道某大厂的笔试题说起,话不多说直接上题<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial
2022-04-19 01:03:44
1854
1
原创 vue插件 vueI18n国际化
背景最近在做的一个项目中有中英文切换的需求，结合使用的技术栈是vue，所以使用vue-i18n插件配合进行国际化的处理。用法注意点：在项目开发中，我们需要使用模块化的思想来开发，尽可能地把中英文配置文件和实例创建、挂载分开写在不同的文件中，方便后期维护。1、配置挂载//index.jsimport Vue from 'vue'import VueI18n from 'vue-i18n'import enLocale from './en'import zhLocale from './
2022-03-29 10:36:02
1437
2
原创 函数参数结构传值(面试题)
先上题目????const createMember = ({ email, address = {} }) => { const validEmail = /.+\@.+\..+/.test(email) if (!validEmail) throw new Error("Valid email pls") return { email, address: address ? address : null }}const member = createMember({ e
2022-01-06 17:53:32
93
原创 js中Object.defineProperty(面试题)
使用Object.defineProperty(对象，属性名，{描述符})面试题 var obj = { brand: "华为", price: 1999 } Object.defineProperty(obj, 'id', { value: 1 }) Object.defineProperty(obj, 'price', {
2021-12-20 13:01:49
275
原创 js 连等赋值（面试题）
连等赋值概念var a=b=123面试题 let obj = { num1: 117 } let res = obj; obj.child = obj = { num2: 935 } // obj={num2:935} // res={ // num1:117, // child:{
2021-12-20 11:07:05
578
原创 js中Number.isNaN和全局isNaN方法有什么区别(面试题)
全局isNaN：es5中的方法，在使用时，会尝试把括号里面的内容转换为数字，如果转换不成数字，则转换成NaN。Number.isNaN：es6新出的方法，在es5上做了优化，不会尝试把括号里面的内容转换为数字。console.log(isNaN("NaN") == true) //trueconsole.log(Number.isNaN("NaN") == true) //false使用isNaN时，首先字符串NaN会尝试转换成数字，转换不了数字，所以就转换成NaN，那么这个比较也就会成立，返回t
2021-12-19 20:31:07
164
原创 let定义变量细节(面试题)
对于let与var的区别let有块级作用域let存在暂时性死区let不能变量提升今天刷面试题的时候，遇到一个面试题，又对let有了重新的认识，补充了let的知识点，下面看面试题 let a = 'w' let obj = { a: 'o', print: function () { console.log(this.a) } }
2021-12-10 10:32:35
630
原创 vue中watch的使用
定义watch:用来监听某个数据的变化，进而在回调中做出相对应的处理。值为函数<template> <div @click="change">{{info}}</div></template><script>export default { data(){ return{ info:{name:"xiaoming",age:18} } }, watc
2021-08-07 19:14:52
1006
原创 二叉树的层序遍历(js)
除了先序、中序、后序三种遍历外，还有一个层序遍历，所谓层序遍历就是按照每一层的顺序遍历整棵树（也就是说一层一层，从左往右遍历下来）迭代法层序遍历采用配合队列的方式来实现，其原因是它是从左往右遍历的，所以队列这种数据结构非常适合它。var levelOrder = function(root) { if (!root) { return []; } var res = [];
2021-08-06 12:56:18
757
原创 二叉树遍历问题(js)
掌握二叉树的遍历问题是解决二叉树各类问题的基础。遍历类型前序遍历中序遍历后序遍历前序遍历为先遍历根节点，即中左右中序遍历为第二遍历根节点，即左中右后序遍历为最后遍历根节点，即左右中本文主要是以解决leetcode上的题为目的，所以这里就不介绍上面三种遍历具体概念。解决上面这三种遍历的主要有两个方法，递归法和迭代法。递归法前序 var preorderTraversal = function(root) { var res = [];
2021-08-06 12:44:50
98
原创 代理模式（js）
定义为一个对象提供一个代用品或占位符，以便控制对它的访问。具体流程如下：保护代理定义：代理用于过滤掉一些请求，或者直接拒绝请求，不转发给主体。用于控制不同权限的对象对目标对象的访问。其实在javasciprt中我们也有接触过保护代理。熟悉axios的同学都知道，它内部实现了对请求的拦截和响应的拦截，其实这就是保护代理，在响应拦截中，我们可以对服务端响应的数据进行过滤，然后再返回给请求的主体。虚拟代理定义：把一些开销很大的对象，延迟到真正需要它的时候才去创建。虚拟对象实现图片预加载当图片
2021-08-05 16:03:15
453
原创 策略模式(js)
定义定义一系列的算法，把它们一个个封装起来，并且使它们可以互相替换。简单来说，假定有一个函数，我们可以通过向函数传入不同的参数来进行不同的处理，这就是所谓的策略模式。javascript中的策略模式公司根据职位等级计算年终奖案例 var strategies = { "S": function(salary) { return salary * 4; }, "A": function(sala
2021-08-05 15:19:33
219
原创 单例设计模式
定义保证一个类仅有一个实例，并提供一个访问它的全局访问点。（相信仅有一个实例这里大家都能够理解，但访问它的全局访问点是什么呢？就是该类的一个实例然后我们把它保存到外部作用域，这里的外部作用域一般是指全局作用域）。实现单例模式 //普通单例模式实现 function Cat() { //类的其他属性//instance用来保存创建的对象 this.instance = null; } Cat.prototy
2021-08-05 15:05:28
42
原创 css预处理器less和sass
前言这篇文章通过less和sass的对比来学习css预处理器。css预处理器的作用1.能够使用变量，在更换网站风格的时候更加方便。2.能够进行运算。3.能够使用函数。4.文件拆分，使用@import把所有文件连接成一个大文件。5.工程化。总而言之，css预处理器的作用就是让我们写更少的代码，做更多的样式，使css也能够工程化。变量的使用和嵌套，混入和继承，函数使用lesssass 循环lesssass总结postcss...
2021-07-25 16:20:24
458
原创 html元素嵌套关系和面试题
元素正确嵌套不同元素间的正确嵌套能够让我们的代码运行起来能够更加符合我们的预期，而不出现意料之外的错误。一般元素的嵌套规则如下：为什么说行内元素一般不能包含块级元素呢？因为我们在应用中就有活生生的例子，比如一个大的div，我们要通过它来实现点击跳转，那么就需要在div外面包一个a元素了。一些常用标签及标签属性formenctype=“form-data” post请求 进行编码 能够用于上传文件atarget="_blank" 跳转到新创建的窗口input typ
2021-07-25 15:50:29
141
原创 html文档版本声明(DOCTYPE)
DOCTYPE面试题DOCTYPE的作用是什么？答：用于声明html文档以何种形式解析。这可能是大多数人对于该问题的回答，但不知道其所以然，这篇文章就带你解析DOCTYPE。html版本HTML4（SGML）：是XML的超集 松散 浏览器做了很多容错XHTML（XML）：是HTML严格化的结果 比如标签必须是小写HTML5：不属于SGML或XML,比XHTML宽松我们现在在编码时，一般都是要求以html5形式解析html文档，我们只要进行如下声明。html4声明xhtml
2021-07-25 15:40:07
162
原创 算法之二分查找
使用二分法的前提条件1.数组为有序数组2.数组中无重复元素因为一旦有重复元素，使用二分查找法返回的元素下标可能不是唯一的。二分查找边界问题到底是 while(left < right) 还是 while(left <= right)到底是right = middle呢，还是要right = middle - 1呢？二分法有很多版本，主要是因为对区间的定义没有想清楚，区间的定义就是不变量。要在二分查找的过程中，保持不变量，就是在while寻找中每一次边界的处理都要坚持根据区间的定义来
2021-07-11 23:03:19
60
原创 img标签alt和title属性的区别
alt主要用于img标签，在图片因为网络不良，路径错误等而无法渲染到页面时候代替其渲染到页面。（也就是说图片没法显示，就用alt的属性值代替），它会被搜索引擎所识别。alt属性有利于SEO，是搜索引擎搜录时判断图片与文字是否相关的重要依据。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" conten
2021-07-11 11:33:36
426
3
原创 重温HTML5
Html5语义化标签作用：用正确的标签做正确的事情有利于SEO，也就是说有利于搜索引擎搜索在没有css的情况下，以一种文档格式显示，并且是容易阅读的让页面结构化，使喜欢阅读源码的人能够快速定位每个模块相对应的代码常用的Html5布局元素：元素作用header用于定义文档的页眉nav导航栏部分main表示页面主要区域，一个页面一般有一个main标签article文章内容部分section包裹在article里面，把article分为多个部
2021-07-10 21:48:03
73
2
原创 js中关于宏任务和微任务执行顺序的部分细节问题
async function async1() { console.log("async1 start"); await async2(); console.log("async1 end");}async function async2() { console.log("async2");}async1();setTimeout(() => { console.log("timeout");}, 0);new Promise(function(.
2021-04-19 11:59:06
196
原创 webpack的使用
webpack的概念用官网的介绍来说，本质上，webpack 是一个现代 JavaScript 应用程序的静态模块打包器(module bundler)。这种解释可能对初学者来说是一头雾水的。个人理解，webpack就是帮助我们把所有的文件打包成一个文件，或者多个文件，并且对文件进行压缩，最后发布出去的就是这个文件夹。webpack对代码兼容也有许多的好处，我们可以用webpack把js里es6的代码转换成es5的代码，这样能够使代码运行在不支持es6代码的浏览器。webpack四个核心概念入
2021-04-15 00:59:56
126
原创 使用Vue封装导航栏组件
前言：把一个功能模块使用组件化的思想充分封装，如导航栏，这无论对我们的开发思想还是效率都有许多好处，在开发中，我们要尽量多得运用组件化的开发思想，不要把所有代码都写在同一个.vue文件中，这样能大大提高代码的可读性。封装导航栏主要思路：把红色的部分当成一个个组件，而他们只是图片和文字不同，所以我们可以把他们封装成同一个组件，然后向组件里传入图片信息和文字信息即可(可以用插槽)。//TabBarItem.vue<template> <div class="tabBarItem"
2021-04-12 14:42:31
1160
原创 Vue中封装插件
封装插件的好处在一个项目中，我们可能在多个地方需要用到同一个组件，如果我们在每个地方都导入这个组件，并且进行注册，再进行实用，这样子就会非常麻烦，代码的复用性也不是很高，所以这个时候我们就需要用到插件了。封装插件的步骤这里我们以封装一个Toast组件为例1.定义该组件//Toast.vue<template> <div class="toast" v-show="isShow"> <div class="toastText">{{message}}
2021-04-12 14:04:03
1022
原创 Vue中事件总线的使用
事件总线的概念EventBus事件总线，通过事件总线，我们可以在任意两个组件之间传递数据。使用事件总线的原因对于父子组件，我们可以使用props从父向子传递数据，也可以使用**this.$emit(“方法名”,参数)**从子向父传递数据，这确实是非常方便好用了。但如果是非父子组件，我们就无法通过这种方式来传递数据了，事件总线就是用来处理这种情况的，实质上EventBus是一个不具备 DOM 的组件，它具有的仅仅只是它实例方法而已，因此它非常的轻便。事件总线的使用1.首先我们要定义事件总线//ma
2021-04-12 10:16:21
578
原创 css中变量使用
使用css变量的原因当我们在网页中需要大量使用相同的属性值时，如颜色，字体，字体大小等，当我们需要修改属性值时，就需要全部修改，工作量较大。使用css变量的好处如果我们使用css变量来定义这些颜色，字体和字体大小，那么我们只需要在一个地方修改属性值，就可以修改所有地方，这就能减少我们的工作量。css变量的使用方法定义<style> /* :root指向根节点 */ :root { --color: red; --font-s
2021-03-25 16:31:57
159
原创 vue脚手架配置路径别名
vue-cli 项目配置路径别名vue-cli 2.x配置方式在vue-cli 2.x项目中，进入build文件夹，找到webpack.base.conf.js，编辑文件 ，并找到resolve字段的配置项。resolve: { extensions: ['.js', '.vue', '.json'], //这个是匹配扩展名的 alias: { '@': resolve('src'), //src解析成@
2021-03-25 16:22:11
851
原创 js中toString和valueOf区别
toString（）valueOf（）这两个方法几乎出现在js中所有类型对应的内置对象的原型上（null和undefined除外）,它们的出现解决了值运算的问题，但也出现了隐式转换这个让人头疼的问题。toString()返回一个表示当前值的特殊字符串，当对象表示为文本或以期望字符串被调用时，toString()方法会自动调用，比如用console.log(）或者alert()方法输出值时，就会自动调用该方法，在进行值比较时，也可能触发该方法，也有可能触发valueOf方法，关于何时触发这两个方法.
2021-03-25 14:35:18
214
原创 node.js常用中间件
body-parser用于接收前端发送post请求传过来的数据。var bodyParser = require('body-parser')app.use(bodyParser.urlencoded({ extended: false }))app.use(bodyParser.json()) //app为express框架实例对象。//在路由里使用req.body即可接收到前端传过来的数据。koa-bodyparserkoa框架里用来接收前端发送post请求传过来的数据。var bo
2021-03-06 11:25:53
864
原创 express实现后台普通增删查改接口
demo介绍：该小demo简单实现了后台管理的分类接口功能。所用技术：express框架+mongodb数据库+中间件。目录结构–server --models --Category.js --plug --db.js --routes  
2021-03-05 23:11:07
391
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人