自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 Vue3 扫描二维码

vue3 扫描二维码功能 vue3 识别二维码图片功能

2022-05-25 15:05:33 6845 18

原创 http状态码详解

100 Continue 继续。客户端应继续其请求101 Switching Protocols 切换协议。服务器根据客户端的请求切换协议。只能切换到更高级的协议,例如,切换到 HTTP 的新版本协议200 OK 请求成功。一般用于 GET 与 POST 请求201 Created 已创建。成功请求并创建了新的资源202 Accepted 已接受。已经接受请求,但未处理完成203 Non-Authoritative Information 非授权信息。请求成功。但返回的 meta 信息不在原始的

2022-05-09 15:50:38 147

原创 前端错误/异常捕获并上报

参考链接:https://juejin.cn/post/6844904119136698381

2022-05-06 11:03:46 422

原创 vue 父子组件生命周期执行/渲染顺序

在正常开发,挂载周期的执行顺序为:父beforeCreate => 父created => 父beforeMount => 子beforeCreate => 子created => 子beforeMount => 子mounted => 父mounted在数据更新阶段执行顺序为:父beforeUpdate => 子beforeUpdate => 子updated => 父updated在组件销毁阶段执行顺序为:父beforeDestroy

2022-04-28 10:03:57 5120

原创 vue.config.js 配置

module.exports = { // 基本路径 publicPath值为:"./" 打出来的包可以部署在任意路径 // publicPath值为:"/my-app/" 包要部署在 "/my-app/" 的子路径里 publicPath: './', // 打包输出文件目录(当运行 vue-cli-service build 时生成的生产环境构建文件的目录) outputDir: 'dist', // 指定生成的 打包入口html文件 名称 ind

2022-04-27 17:06:15 166

原创 vite+vue3+ts+pinia项目搭建

环境依赖版本node:v14.15.4vite:^2.8.0vue:^3.2.25typescript:^4.5.4pinia:^2.0.12vue-router:^4.0.14vueuse:^8.2.0eslint:^8.12.0prettier:^2.6.1commitizen:husky:^7.0.41. 初始化项目 按步骤提示初始化:使用 vite-cli 命令pnpmpnpm create vitenpmnpm init vite@latestyarnya

2022-04-12 09:41:54 2956 4

原创 ts.config.js 配置

{ "compilerOptions": { /* Basic Options */ "target": "es5" /* target用于指定编译之后的版本目标: 'ES3' (default), 'ES5', 'ES2015', 'ES2016', 'ES2017', 'ES2018', 'ES2019' or 'ESNEXT'. */, "module": "commonjs" /* 用来指定要使用的模块标准: 'none', 'commonjs', 'amd', 'sys

2022-04-09 11:41:21 1815

原创 vue 事件修饰符

在Vue中,修饰符处理了许多DOM事件的细节,让我们不再需要花大量的时间去处理这些烦恼的事情,而能有更多的精力专注于程序的逻辑处理vue中修饰符分为以下五种:表单修饰符事件修饰符鼠标按键修饰符键值修饰符v-bind修饰符表单修饰符:lazytrimnumberlazy在我们填完信息,光标离开标签的时候,才会将值赋予给value,也就是在change事件之后再进行信息同步<input type="text" v-model.lazy="value"><p>{

2022-03-21 14:49:54 12660

原创 vue diff算法

一. 什么是diff算法:diff 算法是一种通过同层的树节点进行比较的高效算法。其有两个特点:1.只会在同层级节点进行比较,不会跨级。2.diff比较过程是从两侧向中间进行比较。二. 比较方式:diff整体策略为:深度优先,同层比较1 .比较只会在同层级进行, 不会跨层级比较。一层对一层清晰明了。不存在交叉循环对比。速率快。这里是引用 https://github.com/febobo/web-interview/issues/24比较的过程中,循环从两边向中间收拢。个人理解类似二

2022-03-01 17:18:06 1030

原创 页面按回车刷新或者跳转页面

再使用element ui 做后台管理系统的时候,遇到过这种问题,没有监听回车键盘事件,但是按下回车页面会刷新或者跳转,经查找,是因为页面包含el-form,表单内容有一个输入框或者两个的时候,必会触发回车按键自动提交,所以如果有表单提交按钮的时候,可以加一个阻断@submit.native.prevent 属性:<el-form @submit.native.prevent></el-form>这样回车就不会触发了...

2022-02-18 10:04:48 592 1

原创 vue组件之间的传值(组件之间的通信)

组件间通信的分类可以分成以下几类:父子组件之间的通信兄弟组件之间的通信祖孙与后代组件之间的通信非关系组件间之间的通信整理vue中8种常规的通信方案通过 props 传递通过 $emit 触发自定义事件使用 refEventBus$parent 或 $rootattrs 与 listenersProvide 与 InjectVuexprops传递数据(父向子)子组件设置props属性,定义接收父组件传递过来的参数父组件在使用子组件标签中通过字面量来传递值Children.v

2022-01-20 16:44:24 169

原创 vue2.x 数组或者对象新增数据改变页面不刷新

在日常开发过程中,经常遇到数组新增或者对象新增属性数据打印刷新,但是vue视图确不刷新,这个有几种解决办法,下满我们先来说下为什么不刷新视图,再介绍下几种解决方法:直接添加属性的问题:首先定义一个p标签,通过v-for指令进行遍历然后给botton标签绑定点击事件,我们预期点击按钮时,数据新增一个属性,界面也 新增一行<p v-for="(value,key) in item" :key="key"> {{ value }}</p><button @cli

2022-01-19 16:59:52 4041

原创 vue 单页面路由守卫

// 跟methods: {}等同级别书写,组件路由守卫是写在每个单独的vue文件里面的路由守卫beforeRouteEnter (to, from, next) {// 注意,在路由进入之前,组件实例还未渲染,所以无法获取this实例,只能通过vm来访问组件实例next(vm => {})}beforeRouteUpdate (to, from, next) {// 同一页面,刷新不同数据时调用,}beforeRouteLeave (to, from, next) {// 离开当前

2021-03-02 17:03:19 862

原创 h5 ios 滑动白屏(h5滑动和webview 滑动动作冲突)

解决h5页面在ios设备上下拉显示下层白屏 或者 局部下拉触发页面webview下拉 导致局部下拉失效,经过整理,发现了两种可行方案,一种是给整个页面设置position:fixed 另一种是禁止页面touch事件document.body.addEventListener('touchmove', function (e) { if(e._isScroller) return; e.preventDefault(); }, {passive: false});以上两种方式都可以解决下来空白下显示。但是

2020-12-30 14:10:40 3430 1

原创 H5页面 苹果X以上(ios11.2以上)解决底部菜单长条 遮挡屏幕时间失效问题

ios 留海屏幕 苹果X 以上 按键取消 屏幕下边会有一个菜单横条 h5页面全屏时 会遮挡屏幕 有时候按钮重叠在屏幕菜单区域 造成事件失效。解决办法很简单。首先,在页面mate 里添加属性 viewport-fit=cover:示例:<meta name="viewport" content="width=device-width, viewport-fit=cover">在页面样式里 给出菜单空间padding-bottom: constant(sa

2020-12-10 14:36:22 1357

原创 vue 路由嵌套(子路由跳转报错或者失效解决方法)

嵌套路由时,子路由懒加载有时会失效,最好定义引用好,再进行加载,示例结构:{ path: '/shopRech', redirect:'/shopRech/shopRechHome', component:{ template:'<div> <router-view></router-view></div>' }, meta: { title: '积分充值'}, children:[ {

2020-11-24 11:39:13 9679 1

原创 vue 后台返回数据带回车换行不生效

vue 加载后台返回数据到模板 带回车符号 只需要把当前标签样式 加上white-space: pre-wrap; 再把数据用v-html 输出 就可以啦示例:<div class="refuse-content" v-html="item.content"></div><style>.refuse-content { width: 150px; margin-top: 8px;

2020-09-09 11:17:40 1343

原创 没add时取消merge

git merge --abort

2020-05-21 17:19:34 182

原创 git 指定版本回退

首先查看操作日志git log --pretty=oneline找到你要回跳的版本然后git reset --hard *****(你的版本号)恢复的你的版本再git push就欧了

2020-05-09 10:15:37 140

原创 h5 页面 ios 回退后 页面样式不刷新(动态点击样式不起作用)

ios11 以上,我们有时候会遇到这个问题,我们的页面跳转到别的网站或新域名,或者其他类似操作,当点击浏览器自带的返回按钮,我们页面的样式没刷新,设置动态样式也不成功。此时有两种解决办法:1.window.srcoll(0,-1) 点击更换样式失效,或者其他操作赋值动态样式,我们发现只要滑动下页面,样式就会改变。那么在时间出发更改dom样式的时候,自动出发滚动条,完成样式更改。2.业务上添加如...

2020-04-30 13:58:45 894

原创 前端js获取不到cookie

前端获取用js 对于cookie操作,不管怎么封装,根本语法在document.cookie :存储:document.cookie=“a=a”获取:document.cookie删除:document.cookie=“a=” (覆盖cookie中a的值为空)在开发中,我们可能会遇到服务端存给前端的cookie取不到值,那么要看下语法错误与否,自己存储一条再获取看看是否取的到,如果取的...

2020-04-28 15:36:44 4615

原创 input file 大小限制失效

简单粗暴一次触发如果有大小判断控制不上传图 那么二次触发失效 此时$(’#a’).val() 把input的value值重置为空 就可完美解决问题

2019-12-20 17:04:23 233

原创 vue computed计算属性加参数调用

有一些需要多参数或者复杂的计算逻辑,可以用两种方式去写,一种是methods js方法return回计算值,一种是计算属性加参数计算,第一种就不做陈述,大家应该都会,第二种是比较麻烦一点,但是也可以实现这个多参计算需求,直接上代码computed:{a(){return function(q,w){return q+w //可以直接调用a(q,w)}}{{a(q,w)}}...

2019-12-10 11:33:10 1151

原创 前端-javascript-事件流机制,事件委托,事件代理详解

事件委托或者事件冒泡其实都是基于js的事件流机制产生的。在说时间委托和事件代理之前,我们先来了解下事件流,搞懂事件流,也就知道了事件委托,事件代理是怎么回事了,下面上个图(摘自https://www.cnblogs.com/wxf-h/)[外链图片转存中…(img-cyFQAOr1-1571299381221)]...

2019-10-23 16:39:05 388

原创 前端开启本地服务调试

开启前端本地服务:anywherenpm 安装 anywhere :npm install anywhere -g启用方式:npm进入到在你的页面目录 输入 anywhere 会直接开启浏览器进服务

2019-08-25 15:44:56 507

原创 axios基础封装

import axios from ‘axios’;import qs from ‘qs’;export default{requestUrl:{problemlList:‘接口地址’},request:(url,method,data,header,callback)=>{url=="/jrbt-h5/user/clickHistory4h5" ? url=“测试域名”+ur...

2019-06-28 12:27:36 172

原创 vue axios 回调后data中数据取不到

造成axios取不到值得原因主要是this回调问题。当你执行完函数function时,this指向放生变化。导致this指向函数体本身。这时this.data里的数据取不到。简单直接的解决就是把function写成箭头函数形式,箭头函数不是构造函数,不会指定this,而是抓取上下文this作为自己的this。从而解决本问题。下面上代码:错误示例:import axios from ‘axios...

2019-06-28 12:26:16 3741

空空如也

空空如也

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

TA关注的人

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