- 博客(37)
- 收藏
- 关注
原创 保留两位小数tofixed的坑
227.375保留两位小数大部分人会想到使用tofixed 传2保留两位小数,后发现这个227.375保留小数本该是227.38但现在是37这就tofixed 的一个问题具体怎么修改呢,我在第三位是5的时候进行判断然后进一
2022-07-26 11:05:42 310 1
原创 iOS页面滚动兼容性问题
这几天发现了个问题iOS列表页到详情页然后返回到列表页白屏,有时候会半个页面白屏,有时候会整个页面白屏当然我的是整个白屏,需要滚动下页面才可以展示出来东西,到网上找了好多办法,最后使用history 新增的一个属性成功解决...
2022-07-11 14:43:17 304
原创 git本地创建仓库,提交代码后报错
两行代码即可解决git checkout -b dev-0625创建一个名字叫dev-0625的分支并且切换到这个分支git push origin dev-0625将本地新增的分支添加到远程服务器
2022-06-22 16:13:21 167
原创 解决vux刷新页面数据丢失问题
测试出现一个问题网络不好的情况下页面重新刷新,导致vuex中的数据丢失我是使用localstorage来解决的1.在列表页使用window.localstorage.setItem('名',变量)2.在详情页使用window.localstorage.getItem('名')注意事项:当你存的内容是一个对象的时候就使用JSON.stringify将它变为字符串 获取的时候就将字符串使用JSON.parse将它变为对象来使用 此时这里的数据是不会变的,如果切换列表
2022-03-31 17:19:59 338
原创 vant中单选框禁用时icon的变化
页面有个需求,单选框按钮的禁用的icon需要ui的切图来用1.单选框没有禁用时设置的icon 未选中状态 .van-radio__icon--rond .van-icon{ width:1.25rem; height:1.25rem; background:url(../assets/imges/no-select.png)// 这个是背景图可以替换 display:inline-block; margin-right:1px; content:'';
2022-03-31 10:29:43 789 1
原创 inline-block布局问题
前几天写页面出现了一个问题列表用inline-block布局然后出了找了一个间隙,如果是向上对齐就用vertical-align的值为top
2022-03-14 15:01:37 127
原创 返回多级页面
前几天测试给提了个bug,从列表页跳转到详情页,再从详情页跳转到记录页面,在列表页调的接口,使用router将参数传递过去的,详情页面再调用接口,通过router将内容传递到记录页面,但是这样的话就存在一个bug,当我从记录页面返回详情页面的时候就是空白页面,是因为路由传递造成的bug。使用vuex解决的,将列表页的数据通过commit进行修改,然后在详情页使用getter获取,然后再将详情页向记录页传递的内容用vuex保存起来,在详情页用commit进行修改,在记录页用getters获取。这样就不会出现白
2022-02-17 09:14:15 310
原创 深拷贝案例
模糊查询时候遇到一个问题1.在我输入的时候会准确的检索出来2.回家搜索出来的东西放在新的数组当中目前问题是1.当我搜索的时候我输入了以后再删除,我返回主页面的时候会出现两个数组进行了合并,也就是说新数组=旧数组这个时候就出现了一个问题也就是所谓的浅拷贝浅拷贝就指的是新数组改变然后旧数组也会改变,因为两个数组指向同一个prototype解决办法js on.parse(json.stringfiy)...
2022-01-13 11:31:46 166
原创 vant中修改禁用按钮的颜色
vant修改禁用按钮的颜色 对勾以及背景颜色/deep/.van-radio_icon–disabled.van-radio_icon–check ed I {color:red}
2022-01-06 16:27:13 2345
原创 vscode离线安装插件
1.先把需要下载的插件进行解压2.打开安装好的vscode 点击左侧导航最后一个右边有三个点 点击它,选择install3.然后在弹出来的框选择路径然后安装下来就OK了
2022-01-05 19:24:16 201
原创 vue中tab切换默认页设置问题
vue中两个tab切换然后跳转到对应子页面返回后不是本来的页面的问题解决方法:使用vuex,state里面定义一个变量,约定1为其中一个页面,则2就是另一个页面,当进入子页面时,在页面上使用commit来改变量的值并传递,在上一级的页面上判断,对比变量的值,然后来看那个页面显示大致思路就是这样了,笔记本不在跟前,只能手敲了,不明白私信问我呦~...
2022-01-05 19:18:58 1275
原创 cmd中vue脚手架报错
cmd中遇到的问题?如果你的vue-cli一直报serve的错,你可以将当前项目的node_modules给删除,然后使用npm install 来下载依赖,然后重新生成一个node_modules,然后就可以是使用了。切记不是版本的问题!!!...
2021-09-18 18:02:52 349
原创 React实现上拉刷新
React实现下拉刷新、图片懒加载、上滑加载更多、图片预加载1.首先在componentDidMount钩子函数中,调用接口,之后CarList渲染到页面async componentDidMount() { // 这里是调用接口 this.CarArray = await searchCar({ page: 1, mod: "宝马" }); //console.log(this.CarArray) // 这里是设置值 this.setState({
2021-09-02 21:57:17 891 4
原创 react中redux的使用流程
react中redux的执行过程?1.先下载安装包redux与react-redux 一下是我的版本号2.在index.js中引入 将内容使用Provider包裹3.在public底下创建一个store文件夹里面是index.js文件和actions.js3.1在index.js中createStore,将数据定义然后根据actions.type来判断,返回不同的值,并将action引入,最后导出这个文件。import {createStore} from 'redux';// 这里是引入
2021-08-31 14:26:56 415
原创 react实现拖拽(原生)
react实现原生的拖拽大致思路如下:1.在给要拖拽的元素添加touchstart事件。在touchstart事件里面获取到鼠标在元素上的位置ev.changedTouches[0].pageX-ev.target.offsetLeft,然后添加touchmove的事件,在touchmove事件里面获取ev.changedTouches[0].pageX-上面求出的鼠标的位置就求当前的位置,然后给当当前要拖拽的元素设置style的left与top值,话不多说上代码注意样式里面要加定位 这里的this只能
2021-08-24 16:26:06 991
原创 react实现拖拽
react实现拖拽1.先下载react的项目步骤:1.创建一个新的文件夹cmd访问2.输入命令 npm install -g create-react-app 然后 create-react-app my-new-app(my-new-app为文件夹名称,可自定义)2.在src下创建新的文件夹,然后在新的文件夹下创建js文件跟css文件,在js文件里面import React from 'react'import './tzs.css'class Drag extends React.Com
2021-08-23 15:21:51 774
原创 左右联动详细
实现左右滑动切换内容(仿美团下边左边点击右边内容切换)<template> <div class="scroll"> <div class="scroll-left" ref="scroll-left"> <div class="scroll-left-item" :class="index == leftIndex ? 'ac' : ''" @click="leftTab(index)"
2021-07-13 20:15:11 111
原创 router与route的区别
router与route的区别1.router是v-router的实例,是一个 全局的路由对象 ,包含了路由的 跳转的方法、钩子函数 等等。2.route是一个局部的对象, 当前活跃的, 包含了 path 、 params 、query 、 matched 、 name 等路由信息参数...
2021-07-13 20:06:55 1662
原创 配置草料二维码
如何在浏览器(chrome)配置草料二维码1.下载安装包(https://cli.im/help/53255)2.在浏览器输入:chrome://extensions/,进入扩展程序页面,打开开发者模式并刷新页面3.将解压好的文件夹拖拽到扩展程序页面,完成添加(注意这里如果是乱码的话,解压好之后把文件夹里面的东西放到好的文件夹中)...
2021-07-13 19:58:47 242
原创 上拉刷新原生
实现上拉刷新功能(及小车运动的效果)仿优信二手车<template> <div class="car-box"> <div class="car"></div> <div class="box" @touchstart="fnstart" ref="Element"> <div class="con-txt">上拉刷新</div> </div> </di
2021-07-13 10:13:48 108
原创 vue的响应式原理
vue的响应式原理当创建vue实例时候,vue会遍历data选项的属性,利用object.defineProperty将属性转为getter和setter对数据的读取进行劫持(getter用来依赖搜集,setter用了派发更新)并且在内部追踪依赖,在属性被访问和修改时通知变化。更新数据关联的虚拟DOM数。...
2021-07-12 20:48:37 58
原创 http与https的区别
http与https的区别1.https协议需要到CA(Certificate Authority,证书颁发机构)申请证书,一般免费证书较少,因而需要一定费用(以前的网易官网是http,而网易邮箱是https)2.http是超文本传输协议,信息是明文传输,https则是具有安全性的SSL加密传输协议。3.http和https使用的是完全不同的连接方式,用的端口也不一样,前者是80,后者是443。4.Http的连接很简单,是无状态的。Https协议是由SSL+HTTO协议构建的可进行加密传输、身份认证
2021-07-12 20:35:24 450
原创 配置px转rem过程
配置px转为rem的过程(https://www.cnblogs.com/doude/p/11405638.html)1.npm中输入npm install lib-flexible --save2.在main.js中引入“lib-flexible”1.import ‘lib-flexible’ // 移动端适配 (目录: hello-world/src/main.js)3.创建一个vue.config.js` module.exports = {chainWebpack: (config)
2021-07-09 19:18:58 69
原创 nextTick的原理
nextTick知道吗,实现原理是什么?1.vue用异步队列的方式来控制DOM更新和nextTick回调先后执行2.microtask因为其高优先级特性,能确保队列中的微任务在一次事件循环前被执行完毕3.因为浏览器和移动端兼容问题,vue不得不做了microtask向macrotask的兼容(降级)方案...
2021-07-09 17:18:41 63
原创 阻止事件冒泡方法
阻止事件冒泡方法1.event.stopPropagation()方法这是阻止事件的冒泡方法,不止事件向document上蔓延,但是默认事件任然会执行,当你调用这个方法的时候,如果点击一个连接,这个连接仍然会被打开2.event.preventDefault()方法这是阻止默认事件的方法,调用此方法时,链接不会被打开,但是会发生冒泡,冒泡会传递到上一层的父元素3.return false;这个方法比较暴力,他会同时阻止事件冒泡也会阻止默认事件,不仅阻止了事件往上冒泡,而且阻止了事件本身
2021-07-09 17:11:36 11637
原创 事件执行机制
事件的执行机制,宏列队与微列队与Event-loop宏观队:用来保存待执行的宏任务(回调),比如:定时器回调、DOM事件回调、ajax回调微列队:用来保存待执行的微任务(回调),比如:promise的回调、MutationObserver的回调Js引擎首先必须先执行所有的初始化同步任务代码每次准备取出第一个宏人物执行前,都要将所有的微任务一个一个取出来执行,也就是优先级比宏任务高,且与微任务所处的代码位置无关...
2021-07-09 17:01:14 99
原创 diff算法
diff算法首先diff算法并非vue专用,其他的一些框架都在用,凡是涉及虚拟DOM的多半都要用到diff算法。比如我们已经由html解析器构建DOM树,我们再根据真实的DOM生成一颗virtual DOM某个节点的数据改变后,期间就会进行新旧节点的对比,而这个对比的过程就是diff算法的一个过程。同级之间的算法...
2021-07-08 20:10:14 119
原创 强缓存与协商缓存区别
1.基本原理1)浏览器在加载资源时,根据请求头的expire和cache-control判断是否命中强缓存,是则直接从缓存读取资源,不会发送请求到服务器。2)如果没有命中 强缓存,浏览器一定会发送一个请求到服务器,通过last-modified和etag验证资源是否命中协商缓存,如果命中,服务器会将这个请求返回,但是不会返回这个数据的资源依然是从缓存中读取资源3)如果前面两者都没有命中,直接从服务器加载资源2.相同点如果命中,都是从客户端缓存中加载资源,而不是从服务器加载资源数据3.
2021-07-08 20:03:29 711
原创 2021-07-08
link与@import的区别一、来源的差别:link属性XHTML标签,而@import在页面加载完成后才会加载引用的css二、加载顺序的差别:在页面加载的时候,link会同时被加载,而@import在页面加载完成后才会加载引用的css三、兼容性的差别:@import属于css2.1版本,只有在IE5以上才可以被识别,而link是HTML标签,不存在浏览器兼容性问题四、使用dom控制样式是的差别;当使用JavaScript控制dom去改变样式的时候,只能使用link标签,因为@import不是do
2021-07-08 19:45:35 65
原创 2021-07-08
如何解决跨域问题1.vue框架解决跨域问题,反向代理,vue-cli配置proxy:在vue.config.js中配置proxy2.cors后端设置请求头3.后端做代理,后端请求接口,把请求过来的数据返回给前端,后端配置nginx代理4.前端jsonp...
2021-07-08 19:26:40 46
原创 2021-07-08
async与defer向html页面中插入javascript代码主要方法就是通过script标签。其中包括两种形式,第一种直接在script标签之间插入js代码,第二种即是通过src属性引入外部js文件。由于解释器在解析执行js代码期间会阻塞页面其余部分的渲染,对于存在大量js的页面来说会导致浏览器出现长时间的空白和延迟,为了避免这个问题,建议把全部js引用放在标签之前。1.defer和async在网络加载过程是一致的,都是异步执行的。2.两者的区别在于脚本加载之后何时执行,可以看出defer更符合大
2021-07-08 19:18:12 52
原创 MvvM与MVC
谈谈对MVC与MVVM的理解(面试题)第一:前端是没有MVC,MVVM这个概念的,这个概念是从后端借3鉴过来的第二:MVC:M这一层是数据,V这一层是页面,C这一层是业务逻辑,如果要触发的话,首先从页面触发,比如在页面添加点击事件发射请求,这个时候就从页面触发了,以前的话页面触发,请求完了接口 ,就返回了数据,如果使用MVC从页面触发之后会到C这一层告诉M把数据返回给V,这时候就会导致两个问题1.C端过于庞大2.整个程序的耦合度高(类似于红薯跟,牵一发而动全身)第三:后来我们采用了vue中的MVVM这
2021-07-01 19:20:17 289 2
原创 2021-06-16
清除浮动8种1.给父元素设置高 给其设置height="",来防止父盒子塌陷 <style> .box1{ width: 800px; height: 300px; border: 1px solid red; } .box2{ height: 300px; width: 300px; background-color: yellow; float: l
2021-06-16 18:39:11 45
原创 2021-06-16
行内行内块块有什么区别行内块 行内:display:inline eg:span,i,a,b,strong,em sub sup u label br font 特点:不独占一行,不可以设置宽高行内块行内块:display:inline-block eg:img textarea input select 特点:可以设置宽高,不独占一行块块级:display:block eg:div p h1-h6 hr ul ol li dl dd dt form 特点:独占一
2021-06-16 18:24:15 63
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人