- 博客(39)
- 收藏
- 关注
RSS订阅原创 ip正则表达式
var Sip = (rule, value, callback) => { if (/^((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})(\.((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})){3}$/.test(value) == false) { callback(new Error("请输入正确的IP!")); } else { callback(); } };调用：..
2021-06-30 16:40:51
268
原创 cnpm-v 或 cnpm i 没有反应
方法一。npm清理缓存：npm cache clean -f方法二。第一种不行，就第二种npm config set registry http://registry.cnpmjs.org
2021-06-01 15:10:43
750
原创 Warning: Setting pre-commit script in package.json ＞ scripts will be deprecated
我是直接把node安装包删除就可以提交代码到git上了，下面是报错信息> git -c user.useConfigOnly=true commit --quiet --allow-empty-message --file -Warning: Setting pre-commit script in package.json > scripts will be deprecatedPlease move it to husky.hooks in package.json, a .husk
2021-05-13 10:47:53
1676
原创 echarts timeline参数,属性
名称默认值描述{boolean} showtruetrue(显示),false(隐藏){string} type‘time’模式是时间类型，时间轴间隔根据书简跨度计算，可选为:“number”{boolean} notMergefalse时间轴上多个option切换是否进行merge操作，同setOption第二个参数{boolean} realtimetrue拖拽或点击改变时间轴是否实时显示{numbet | string} x80时间轴左...
2021-04-29 16:33:19
3134
原创 前端浏览器兼容性问题及解决方案
不同浏览器的内核不尽相同，所以各个浏览器对页面的解析存在一定的差异。 浏览器内核主要分为两种：一是渲染引擎，另一个是js引擎所以浏览器兼容性问题一般指：Css兼容和Js兼容一、Css兼容1.不同浏览器的标签默认的margin和padding不同**问题症状：**随便写几个标签，不加样式控制的情况下，各自的margin和padding差异比较大碰到频率： 100%解决方案：1.Css里面写*{margin:0,padding:0},但是性能不好2.一般我们会引入reset.css样式重置.
2021-03-12 19:45:57
1201
原创 Vue中data不能检测数组
data(){ return( arr:['a','b','c'] )}this.arr[1] = 'a1' // 不是响应式的，也就是不能改变this.arr.length = 2 //不是响应式的//解决方案：//Vue.set(this.arr,1,a1) //第二种方案：//this.arr.splice(newLength)
2021-03-12 18:59:13
334
原创 手写深拷贝
手写深拷贝(递归)：const obj1 = { age:20, name:'张三', address:{ city:'beijing' }, arr:['a','b','c']}const obj2 = deepClone(obj1);obj2.address.city = "shanghai"obj2.arr[0] = 'a1'console.log(obj1.address.city)console.log(obj.arr[0])//深拷贝function deep
2021-03-11 10:49:46
184
原创 小程序生命周期
Page({ data:{}, onLoad:function(options){ //页面创建时执行 }, onShow:fucntion(){ //页面出现在前台时执行 }, onReady:function(){ //页面首次渲染完毕时执行 }, onHide:function(){ //页面隐藏后执行 }, onUnload:function(){ //页面销毁时执行 }, onPullDownRefresh:function(){ //触发下拉刷新时
2021-03-09 15:20:58
129
原创 axios二次封装
在src目录下创建一个utils文件，里面有三个JS文件，分别时config.js（url、请求方式），core.js（请求拦截，响应拦截，请求超时），index.js（接口文件）首先在core.js里面引入axios和vant组件的Toast弹框设置超出时间，以及baseURL请求拦截、响应拦截//请求拦截//请求发送之前// var loading = null;axiosInstance.interceptors.request.use((config)=>{ //拦
2021-03-03 09:49:17
271
原创 Vue3动画路由转场
<template><div id="app"> <router-view v-slot="{Component}"> <keep-alive> <transition :name="animation"> <component :is="Component"/> </transition>
2021-03-02 21:07:12
1956
5
原创 Vue2生命周期和Vue3生命周期
每个组件都是独立的，都有属于它自己的生命周期，创建、挂载、更新、销毁就是生命周期生命周期有8个分别是：beforeCreate:创建前 ---- created:创建后beforeCreate(创建前)： 在实例初始化之后，这个时候this还不能使用，data中的数据、methods的方法、以及watcher中的事件都不能获得created(创建后)： 实例已经创建完成之后被调用，这个时候可以操作vue中的数据和方法，但是不能对dom节点进行操作beforeMount:挂载前 — mounte
2021-03-01 08:33:21
633
原创 mixin混入
当多个组件有相同的逻辑的时候，使用mixin抽离出来。使用的方法：首先创建一个mixin.js文件，里面可以写多个组件有相同的逻辑内容，在vue组件里引入mixin.jsmixin的问题：变量来源不确定，不易于阅读多个mixin可能有命名冲突mixin和组件可能出现多对多的关系，复杂度较高。多对多：一个mixin可以被多个组件使用，一个组件也可以引入多个mixin，这就是一个多对多的关系...
2021-03-01 07:49:20
231
原创 keep-alive
keep-alive是一个Vue的内置组件，它可以用来缓存组件。它可以使包含的组件保留状态，避免重新渲染，缓存组件在router-view上使用可以缓存路由组件有两个参数 include 只有匹配的组件会缓存 exclude 任何匹配的组件不会缓存...
2021-02-28 21:43:59
119
原创 $nextTick
首先我们要知道Vue是异步渲染的框架。什么叫异步渲染？当data改变之后，DOM不会立刻去渲染，而是data改变后，它会异步去渲染，需要在$nextTick里面去把DOM渲染之后的结果拿出来。以获取最新的DOM节点。<div id="app"> <ul ref="ul1"> <li v-for="(item , index) in list" :key="index"> {{item}} </li> </ul> <
2021-02-28 21:32:02
179
原创 动态组件和异步组件
动态组件的用法 ： :is= "属性名"// is 必须是动态属性component标签: < component :is=“NextTickName” />动态组件怎么用呢？根据原始数据动态渲染的场景，组件类型不确定的情况下。 比如说新闻落地页。<!--<component :is="NextTickName"/>--><div v-for="(val,key) in newsData" :key="key"> <component
2021-02-28 21:02:51
281
原创 slot插槽
slot简单的说就是父组件想在要往子组件里面插入一点内容slot分为三种：基本使用、作用域插槽、具名插槽基本使用：<!-- 父组件 --><template> <div> <!-- 子组件 --> <SlotDemo :url="website.url"> {{website.title}} </SlotDemo> </div></templte><script>
2021-02-28 19:55:54
500
1
原创 v-if和v-show的区别
v-if和v-show的区别v-if:它是对dom节点进行和加载。v-show:它是对dom节点进行隐藏和显示的。那么两者的区别我们应该怎么去选择呢？比如dom节点是一次性的或者说更新不是那么频繁，那么我们就用v-if，不要把过多的东西暴露到浏览器里面。dom节点很频繁的切换，比如说dom一会是这个一会是那个，这样的话就需要去用v-show，因为用display:none来显示隐藏会比较好一些总结： 如果是切换dom比较频繁，我们就用v-show如果切换不是那么频繁，或者是一次性显示隐藏，
2021-02-28 19:04:06
121
原创 浏览器兼容性问题解决方案
前言：不同浏览器的内核不尽相同，所以各个浏览器对页面的解析存在一定的差异。浏览器内核主要分为两种，一是渲染引擎，另一个是JS引擎。所以浏览器兼容性问题一般指：JS兼容、CSS兼容。浏览器内核(渲染引擎)Chrome谷歌之前的Webkit，已改为Blink内核 前缀 -wbkit-FireFox火狐Gecko内核 前缀 -moz-Safari苹果Webkit 前缀 -webkit-IETrident 前缀 -ms-Opera欧朋现已改
2021-01-18 18:29:58
271
原创 JavaScript面试题
1.JS基础谈谈你对原型链的理解？如何判断是否是数组？ES6模块与CommonJS模块有什么区别聊一聊如何在JavaScript中实现不可变对象？JavaScript的参数是按照什么方式传递的？JS有那些类型？为什么会有Biglnt的提案？null与undefined的区别是什么?0.1+0.2为什么不等于0.3？类型转换的规则有那些？类型转换的原理是什么?2.JS机制解释下变量提升？一段JavaScript代码是如何执行的？JavaScript的作用域链理解嘛？谈一谈
2021-01-15 21:53:20
776
原创 后台管理系统开发流程
首先我们是从0开始开发的，那么就要从脚手架开始，这个后台管理系统的项目使用的是Vue脚手架3.0，安装好脚手架之后，我们就可以对项目进行封装模块，配置多环境变量，方便后期维护和修改，下载Vuex，node-sass，axios，element-ui , 对axios进行封装，请求拦截，响应拦截，对element-ui进行按需引入,配置rem，实现自适应，在请求拦截和响应拦截中添加loading效果，对scss混入使用（mixin）；之后就可以对项目进行渲染数据了。渲染好数据之后就要进行打包在打包的时候
2021-01-14 17:26:46
2859
1
转载 去掉浏览器自带滚动条
style=‘overflow:-Scroll;overflow-y:hidden’ 隐藏纵向显示横向隐藏浏览器自带滚动条::-webkit-scrollbar{display:none;}
2021-01-12 15:03:07
586
原创 Web前端CSS面试题（含答案）
CSS选择器的优先级是怎样的？link和@import的区别?有那些方式(CSS)可以隐藏页面元素？em\px\rem区别？块级元素水平居中的方法？CSS有几种定位方式?如何理解z-index？如何理解层叠上下文？清除浮动有哪些方法？你对css-sprites的理解你对媒体查询的理解你对盒模型的理解标准盒模型和怪异盒模型有什么区别？谈谈对BFC(Block Formatting Context)的理解？为什么有时候人们用translate来改变位置而不是定位?伪类和伪元素的区.
2021-01-12 14:51:26
1092
1
原创 web前端开发面试宝典（含答案）
HTML面试题CSS面试题 (制作中) JS面试题(制作中)HTTP面试题(制作中)TCP面试题(制作中)DOM面试题(制作中)浏览器原理面试题(制作中)前端工程化面试题(制作中)React面试题(制作中)Vue面试题(制作中)前端安全面试题(制作中)webpack面试题(制作中)算法面试题(制作中)字符串类笔试题(制作中)JS笔试题(制作中)如何应对HR面(制作中)如何应对项目面(制作中)如何写简历...
2021-01-11 21:55:22
1137
原创 Web前端HTML面试题(含答案)
doctype(文档类型)的作用是什么这三种模式的区别是什么？HTML、XML和XHTML有什么区别？什么是data-属性？HTML5和HTML4的不同之处有那些常用的meta标签?src和href的区别?知道img和srcset的作用是什么?(追问)还有哪一个标签能起到跟srcset相似在作用script标签中defer和async的区别?有几种前端储存的方式?这些方式的区别是什么?(追问)doctype的作用是什么？DOCTYPE是HTML5标准网页声明，且必须声明在HTM.
2021-01-11 21:45:54
924
1
原创 Vue项目打包
首先安装: cnpm i webpack-bundle-analyzer在vue.config.js文件中添加:const isProduction = process.env.NODE_ENV === 'production';const cdn = { css: [], js: [ 'https://cdn.bootcss.com/vue/2.5.17/vue.runtime.min.js', 'https://cdn.bootcss.com/vue
2021-01-09 14:49:33
211
原创 web面试必问的题
vue双向数据绑定原理vue是采用数据劫持结合发布-订阅的方式,通过object.defineProperty()来劫持各个属性的setter,getter,在数据发生变动时发布消息给订阅者,触发相应的监听回调来渲染视图第一步:需要observer的数据对象进行递归遍历,包括子属性对象的属性,都加上setter,getter,这样的话，给这个对象的某个值赋值,就会触发setter,那么就能监听到数据变化简单来说就是实现一个数据监听器Observer，它能够对数据对象的所以属性进行监听,如果有变动..
2021-01-06 14:45:50
4121
6
原创 三目运算符
<div v-for="(item, index) in listTo" :key="index" :class="indexx == index ? 'item_vant_titleaa' : 'item_vant_title'" @click="onClicklistTo(index)" > {{ item.text }} </div>
2020-12-31 16:19:52
406
原创 JavaScript变量类型和计算 面试题
题目：typeof能判断那些类型typeof运算符//判断所有值类型let a; typeof a //'undefined'const str = 'abc'; typeof str //'string'const n = 100; typeof n //'number'const b = true; typeof b //'boolean'const s = Symbol('s') typeof s //'symbol'//能判断函数typeof conso
2020-12-30 17:20:29
164
原创 原型和原型链由前到深
首先,来说原型,但说到原型就要从函数说起,因为原型对象就是指函数所拥有的prototype属性;(所以下文有时说原型,有时说prototype,它们都是指的原型)。1.函数说到函数,我们要先有个概念 : 函数也是对象,和对象一样拥有属性 , 例如：function F(a,b){ return a * b}console.log(F.length) //2 指函数参数的个数F.constructor //function Function(){ [native code] }console.
2020-12-30 16:22:48
183
原创 配置rem
1.rem + postcss-plugin-px2rem安装 lib-flexible 和 postcss-plugin-px2remcnpm install lib-flexible postcss-plugin-px2rem --save-dev配置rem:main.js导入 import ‘lib-fiexible/flexible’; rem就可以生效了;配置px --》 rem:创建vue.config.jsmodule.exports = { css: {
2020-12-30 15:15:56
184
原创 小程序目录结构和Promise
小程序目录结构全局文件:app.js ： 配置的全局 入口文件app.json ：全局配置文件app.wxss : 全局样式文件pages : 存放页面的文件夹index : 文件夹 首页index.js : 首页的逻辑文件index.json 首页配置文件index.wxss: 首页样式文件index.wsml 他和.html文件相同utils : 第三方工具文件夹PromisePromise是什么,他就是一个容器, 里面保存着异步操作的结果从语法上说,Promise是一个对象
2020-12-17 22:02:01
150
原创 前端面试题总结以及回顾
面试题总结HTML面试题如何理解HTML语义化？默认情况下,那些HTML标签是块级元素，那些事内联元素?CSS 基础知识1.css-布局盒子模型的宽度如何计算？margin纵向重叠的问题margin负值的问题BFC理解和应用float布局的问题,以及clearfixflex画色子2.css-定位absolute和relative分别依据什么定位？居中对齐有哪些实现方式?小提示：这个经常会问，而且不止一中实现方式3.css-图文样式line-height的继
2020-12-17 16:12:47
191
1
原创 箭头函数和普通函数的区别以及bind(),apply(),call()的区别.
1.箭头函数和普通函数的区别()=>{}箭头函数又称匿名函数，不能作为构造函数,不能使用newlet f = () =>{ console.log('123')}let fc = new f(); //这一行报错 f is not a constructor箭头函数不绑定argumets,取而代之用rest参数解决//普通函数function A(a){ console.log(arguments); //伪数组 arguments是一个参数的集合 [1,2,3,4,5
2020-12-15 19:56:28
839
1
原创 多人小组开发App思路,开发前的准备
开发前的准备工作过程大致分为五类:准备环节,设计环节,开发环节,内测环节,交付环节；以上的 我们只需要做3个环节的工作：准备环节,开发环节，内测环节1.准备环节1.明确要求根据设计图纸,App模块的划分,模块的布局,交互等。。。2.确认技术栈确认框架,组件库,状态管理方案,权限控制方案,网络请求模块,路由等。。。3.分工确定开发项目,合理分工,熟悉开发环境,培养团队精神;以上已经准备好了的话,那么我们就可以开始开发我们的项目了!2.开发环节根据提供的接口,获取第三方信息；代码必须
2020-12-15 17:00:47
1669
3
原创 GitHub是什么,git指令，git分支，gitHub怎么使用,Linux命令
GitHub1.Gitgit是什么？Git缩写(VCS) Git是版本控制软件,是目前市场最流行的，它可以在任何时间任何状态,通过id将更新记录恢复回来。git分为4个区域工作区,暂存区,本地仓库,远程仓库workspace:工作区staging area : 暂存区local repository:本地仓库remote repository:远程仓库工作区通过 git add . 将文件添加的暂存区暂存区通过 git commit -m 将文件提交给本地仓库本地仓库通过git push
2020-12-15 07:42:21
937
2
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人