自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 vue 表格里的需要自增

表格里的序号自增

2022-08-06 17:02:01 2928

原创 列表中加,减,上下移操作列

列表的增减等操作

2022-07-10 08:47:15 134

原创 vue3父子组件传值

vue3父子组件传值子组件

2022-07-03 16:32:01 747

原创 vue3的路由点击跳转及传参

路由跳转

2022-07-03 16:31:19 317

原创 前端面试题(高级)

前端面试题(高级)https://www.jianshu.com/p/356f10ee476d2.如何判断token过期,3.在ajajx请求时4.beforeforeach()中的钩子函数5.居中定位6.对模块化的理解http://www.javashuo.com/article/p-hheoxdee-k.html规范:CommonJs ,AMD7 keepAlive 级钩子函数activated ,deactivatedroute 路由

2022-06-06 12:00:37 1676

原创 vue路由懒加载

vue路由懒加载

2022-05-30 14:15:00 112

原创 图片压缩的组件实现

图片压缩

2022-05-30 08:58:58 130

原创 vue.config.js配置

vue.config.js配置

2022-05-30 08:36:26 99

原创 微前端框架 —— qiankun

微前端框架 —— qiankunhttps://qiankun.umijs.org/zh/guide微前端是一种多个团队通过独立发布功能的方式来共同构建现代化 web 应用的技术手段及方法策略。针对前端开发人员较多的大型项目比较合适,可分为主工程和子工程...

2022-04-05 21:49:52 1573

原创 Angular中 RxJS的使用场景

Angular中 RxJS的使用场景表单1、模板驱动型表单:所有内容都在HTML中2、响应式表单某些内容移到代码中3、动态表单表单都用代码创建RxJS的典型的应用场景1.http服务2事件处理

2022-02-10 23:22:48 757

原创 Promise与RxJS中Observable的区别

Promise与RXJS中Observable的区别//以下是Promise的写法 let promise = new Promise(resolve => { setTimeout(() => { resolve("---promise timeout---"); }, 2000); }); promise.then(value => console.log(value));//以下是Observable的写法 let st

2022-02-10 22:11:47 589

原创 Angular 的使用注意点

Angular 的使用注意点第一部分命令工具第二部分1.组件,组件树生成器,理清个组件脉络Angular2-dependencies-graph模块Router本质上表示的是当前页面的状态第三部分依赖注入:构造器注入数据绑定:第四部分. UI库5. 参考示例(项目案例)...

2022-02-07 23:23:45 551

原创 如何判断表单中值是否有变化

如何判断表单中值是否有变化若要使修改前后的表单值不同,需对其进行深拷贝

2022-01-27 11:05:54 1022

原创 Vue动态生成列表表头(ant-design)

Vue动态生成列表表头(ant-design)

2022-01-27 11:04:44 1003

原创 0.5px分割线的设置

0.5px分割线

2022-01-27 10:55:37 313

原创 window.location.href和window.open的使用

window.location.href和window.open的使用self.location.href="/url" 当前页面打开URL页面location.href="/url" 当前页面打开URL页面windows.location.href="/url" 当前页面打开URL页面,前面三个用法相同。this.location.href="/url" 当前页面打开URL页面parent.location.href="/url" 在父页面打开新页面top.location.href="/ur

2022-01-11 21:00:00 1483

原创 浏览器兼容的处理

浏览器兼容的处理X-UA-Compatible是针对IE8新加的一个设置,对于IE8之外的浏览器是不识别的,这个区别与content="IE=7"在无论页面是否包含<!DOCTYPE>指令,都是使用了 Windows Internet Explorer 7的标准模式。而content="IE=EmulateIE7"模式遵循<!DOCTYPE>指令。对于多数网站来说,它是首选的兼容性模式。Edge 模式通知 Windows Internet Explorer 以最高级别的可用模

2022-01-11 16:09:30 255

原创 CSS+HTML实现移动端div左右滑动展示

CSS+HTML实现移动端div左右滑动展示//由于手机屏幕的宽度有限,内容太多移动导致不能放在一行,所以很多移动端网站的导航栏都有左右滑动效果<!--外部嵌套层--><div class="div"> <div class="box"> <div class="box1"></div> <div class="box1"></div> <div class

2022-01-11 14:48:43 2844

原创 移动端根据内容的多少,控制(展示更多)按钮的显示与否

移动端根据内容的多少,控制(展示更多)按钮的显示与否 //移动端根据内容的多少来控制按钮的显示与否 claimerDisplayBtn(){ this.$nexttick(()=>{ var bodyWidth = document.body.clientWidth || document.documentElement.clientWidth || 375 //44px显示2行,198px显示9行 /** *免责

2021-12-19 09:29:25 357

原创 请求方法汇总(上传,下载,预览)

请求方法汇总(上传,下载,预览)import axios from 'axios'import { resolve } from 'url';import { error } from 'util';//统一配置let FEB_REQUEST = axios.creat({ baseURL: store.state.settoing.baseURL, responseType: 'json', validateStatus (status) { //200外的 状态码都是失败

2021-12-18 09:30:00 90

原创 解构赋值(ES6)

解构赋值(ES6)解构赋值语法是一种 Javascript 表达式。通过解构赋值, 可以将属性/值从对象/数组中取出,赋值给其他变量。let a, b, rest;[a, b] = [10, 20];console.log(a);// expected output: 10console.log(b);// expected output: 20//分配剩余值[a, b, ...rest] = [10, 20, 30, 40, 50];console.log(rest);//

2021-12-17 19:45:00 1443 1

原创 vue中的MVVM模式

vue中的MVVM模式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <

2021-12-12 23:49:29 137

原创 Vue的相关认识

Vue的相关认识Vue中MVVM模型的理解:如图:Object.defineProperty 方法的理解<script> let number = 18 let person = { name :"张三", sex:"男", // age:18 } //@param 对象名,属性名,配置项 Object.definePropert

2021-12-06 10:18:28 287

原创 js数组对象及对象的互相转换

js数组对象及对象的互相转换数组对象转对象法 一:const array = [{ book: 5, car: 6, pc: 7 }, { headphone: 9, keyboard: 10 }],object = Object.assign({}, ...array);法二 let arrObj = [ { 0: 'a', 1: 'b', 2: 'c', }, ] cons

2021-11-10 16:40:24 458

原创 vue列表循环时,给每个元素加标识符

vue列表循环时,给每个元素加标识符可通过给变量设置... `name${index}`

2021-11-08 10:16:57 538

原创 vue自定义指令的添加

vue自定义指令的添加<template> <div v-cloak v-clickoutside="outsideClose" class="dropmain"> <div @click="show = !show" class="drop"> 测试下拉菜单 </div> <div class="dropdown" v-show="show"> <P>点击下拉菜单内容,点击外部区域

2021-11-06 11:25:11 307

原创 eruda 和vConsole 移动端调试工具

eruda 和vconsole 移动端调试工具https://www.cnblogs.com/fengluzheweb/p/11603154.html

2021-10-18 22:48:53 162

原创 async await 和promise的理解

async await

2021-10-18 22:15:17 136

转载 vue项目中使用pdfjs-dist预览pdf文件+分页并兼容字体

vue项目中使用pdfjs-dist预览pdf文件+分页并兼容字体1.安装npm install pdfjs-dist --save2.引入let PDFJS = require(“pdfjs-dist”);PDFJS.GlobalWorkerOptions.workerSrc = require(“pdfjs-dist/build/pdf.worker.min”);3<div class="center"> <div class="contor">

2021-10-18 22:14:08 5506

原创 vue动画 vue-lottie

vue动画 vue-lottietim-js-sdkcos-js-sdk-v5

2021-10-13 22:02:50 94

原创 vue使用 vant-ui 中的上拉加载的实现

vue使用 vant-ui 中的上拉加载的实现<div> <input/> <table><table/><div>...<van-list v-model="loading" :finished="finished" finished-text="没有更多了" @load="onLoad"><van-pull-refresh v-model="isLoading" @refresh="onRefr

2021-09-26 14:23:26 407

原创 面试题(四)——高级

面试题(四)——高级vue数组响应式原理闭包的使用场景Vue中computed和watch的区别Vue 正确理解mounted、beforeUpdate、updated三个钩子函数的关系vue中keepAlive的使用,如何刷新vue中的插槽–slot和v-slotCSS 动画vue中mixins的理解及应用content-type的作用以及类型Vue中的nextTick作用和几个简单的使用场景setTime(() =>{ },0) ,

2021-08-10 10:53:42 331

转载 vue中watch的使用

vue中watch的使用在vue中,使用watch来响应数据的变化。watch的用法大致有三种。下面代码是watch的一种简单的用法://template<input type="text" v-model="cityName"/>//jsnew Vue({ el: '#root', data: { cityName: 'shanghai' }, watch: { cityName(newName, oldName) { // ...

2021-08-09 14:35:25 155

原创 vue中动态获取元素的高度

vue中动态获取元素的高度

2021-08-07 16:46:03 824

原创 css中如何让按钮中的文字数不确定时,居中显示

css中如何让按钮中的文字数不确定时,居中显示//html... <div class="bottom"> <div class="content"> 1+-------- 页面展示效果 页面展示效果 页面展示效果 页面 展示效果 页面展示效果 </div> </div>//css<style>... .bottom { position: fixed;

2021-08-06 16:09:37 154

原创 promise.all的使用

promise.all的使用在某些页面需同时调用多个后端接口,会存在异步问题,这时需要通过promise.all来处理,当然需要保证接口返回没有报错,即使接口异常,也不用返回报错,可提升系统异常等

2021-07-29 08:44:02 137

原创 css中常用样式的设置(居中div的子元素,设置行数等)

css中常用样式的设置(居中div的子元素,设置行数等) display: -webkit-box; -webkit-box-orient: vertical; /* 指定div元素的子元素的排列方式*/ -webkit-line-clamp: 2; /* 设置文本行数 */ /* 对图片进行剪切 ,保留原比例 */ object-fit: cover; /* 属性允许你一特定

2021-06-25 15:28:21 754

原创 常用的utils

常用的utils//中止请求后端接口export function stopFun(){ //遍历数组中的接口,删除请求 try{ window._axiosPromiseArr.forEach((ele, index) => { ele.cancel(); delete window._axiosPromiseArr[index]; }); }catch(e){ console

2021-06-23 23:00:12 181

原创 vue中处理在keep-alive缓存情况下,页面的刷新

vue中处理在keep-live缓存情况下,页面的刷新可以监听路由:如何设置缓存,可参考:https://blog.csdn.net/weixin_41164499/article/details/90718155

2021-06-17 23:15:53 716 1

转载 css中二倍图,三倍图的使用

css二倍图的使用参考:CSS 或 srcset 让浏览器自动切换 1X/2X/3X 图像移动端项目中 @2x 图 和 @3x 图 的使用(需要支持css3)/*默认大小*/.photo {background-image: url(image100.png);}/* 如果设备像素大于等于2,则用2倍图 */@media screen and (-webkit-min-device-pixel-ratio: 2),screen and (min--moz-device-pixel-ratio

2021-06-17 22:12:17 2513

空空如也

空空如也

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

TA关注的人

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