
笔记
藏剑于袖
这个作者很懒,什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
element ui 表格头部内容不换行
表格头部内容不换行方发封装。原创 2022-11-11 15:57:46 · 2215 阅读 · 0 评论 -
倒计时封装方法简单使用(和平常方式不太一样)
【代码】倒计时封装方法简单使用(和平常方式不太一样)原创 2022-09-08 09:20:54 · 161 阅读 · 0 评论 -
如何使用markdown编辑器
你好! 这是你第一次使用 Markdown编辑器 所展示的欢迎页。如果你想学习如何使用Markdown编辑器, 可以仔细阅读这篇文章,了解一下Markdown的基本语法知识。我们对Markdown编辑器进行了一些功能拓展与语法支持,除了标准的Markdown编辑器功能,我们增加了如下几点新功能,帮助你用它写博客:撤销:Ctrl/Command + Z重做:Ctrl/Command + Y加粗:Ctrl/Command + B斜体:Ctrl/Command + I标题:Ctrl/Command + S原创 2022-06-16 18:03:17 · 166 阅读 · 0 评论 -
前端如何获取用户经纬度问题(jquery获取用户经纬度问题)
IP定位的优缺点:优点:极简,易懂。不需要⽤户地理位置授权,不需要引⽤插件,⼀个ajax完全搞定。缺点:定位不准确,虽说可定位到区⼀级,但实际上⼀般只能定位到市⼀级,偶尔还只能定位到省⼀级,此时就要⽤到⼿动定位了。1⽰例(此处的开发密钥是我已经在腾讯申请好了的,若要引⽤,烦请去腾讯申请,申请流程很简单。)1.31 jquery实现IP定位...原创 2022-06-07 22:26:01 · 1016 阅读 · 0 评论 -
怎样判断当前浏览器是不是微信的浏览器呢?
判断是不是微信浏览器原创 2022-06-02 11:05:28 · 1091 阅读 · 0 评论 -
el-table因为出现垂直滚动条造成多一个td的空白格
el-table因为出现垂直滚动条造成多一个td的空白格效果图解决思路利用deep穿透给倒数第一个表头的右边框去掉,给空白格加上一样的背景颜色就可以了/deep/th { &:nth-child(3) { border-right: 0; } &:nth-child(4) { background: rgb(229, 229, 230); }}解决完后的效果图...原创 2022-05-18 17:25:58 · 1022 阅读 · 0 评论 -
获取当前的域名
在这里插入代码片 window.location.protocol+"//"+window.location.host; // 返回https://mp.csdn.netwindow.location.host; //返回url 的主机部分,例如:mp.csdn.net window.location.hostname; //返回mp.csdn.netwindow.location.href; //返回整个url字符串(在浏览器中就是完整的地址栏)window.location.原创 2022-04-20 11:11:20 · 1428 阅读 · 0 评论 -
css简单动画
首先在css中去定义动画@keyframes rotatel {from{transform:translate(-50%,-50%) rotate (0deg);}to{transform:translate(-50%,-50%) rotate (360deg);}//以上就是定义好的动画 动画名为rotatel //直接在div盒子里调用.div{ animation: //调用动画 rotatel //动画名 15s // 执行时间 lin原创 2022-03-21 20:19:25 · 454 阅读 · 0 评论 -
封装自定义指令(拖拽)——局部
<template> <div class='bag' > 159 <div class="a" v-drag> 12312我 </div> </div></template><script>export default { directives:{ drag(el,bind){ el.onmousedown=function(e){ var原创 2022-03-20 15:06:14 · 279 阅读 · 0 评论 -
拖拽div元素
需要注意要给行内元素left和top,要父相子绝事件为mousedown<template> <div @mousedown="move" class='move'> <img src="../../public/$RAVG6O4.png" /> </div></template><script>export default { data() { return { le原创 2022-03-20 14:25:54 · 95 阅读 · 0 评论 -
如何获取当前的时间和之前的时间呢?
很实际的一个问题直接复制粘贴就可以使用了在html中写个div类名为showTime <script> var t = null t=setTimeout(time,1000) //开始运行 function time (){ clearTimeout(t)// 清除定时器 dt = new Date(); var y = dt.getFullYear();//获取年原创 2022-03-19 22:26:08 · 455 阅读 · 2 评论 -
时间戳在element中如何转化为标准模式?
在后台获取到的时间一般为123456152类似的时间戳,但是我们前端想要的是20212.12.02类型的或者2021年02月16号这样的,可以用过滤器改变//这是时间戳js过滤器代码 filters: {//与data同级 dataFormat(val) {//val是传递过来的时间戳 let data = new Date(val); let y = data.getFullYear(); let m = data.getMonth() + 1;原创 2022-02-16 14:55:53 · 778 阅读 · 1 评论 -
vue的修饰符
一、事件修饰符.stop阻止事件继续传播.prevent 阻止标签默认行为.capture 使用事件捕获模式,即元素自身触发的事件先在此处处理,然后才交由内部元素进行处理.self 只当在 event.target 是当前元素自身时触发处理函数.once 事件将只会触发一次.passive 告诉浏览器你不想阻止事件的默认行为<!-- 阻止单击事件继续传播 --><a v-on:click.stop="doThis"></a><!-- 提交事件不再原创 2022-02-11 16:37:30 · 127 阅读 · 0 评论 -
vue常用指令
v-model 多用于表单元素实现双向数据绑定v-for 格式: v-for="(item,index) in/of 数组json" 循环数组或jsonv-show 显示内容 ,通过display=block/none来控制元素隐藏出现v-hide 隐藏内容 同上v-if 显示与隐藏 (dom元素的删除添加 同angular中的ng-if 默认值为false)v-else-if 必须和v-if连用v-else 必须和v-if连用 不能单独使用 否则报错 模板编译错误v-bind 动态绑定 作.原创 2022-02-07 19:00:40 · 75 阅读 · 0 评论 -
vue的虚拟dom
1. 什么是虚拟dom通过js创建一个Object对象来模拟真实dom结构,这个对象包含标签名(tag)属性(attrs)和子元素对象(children)三个属性,通过vue中的render()函数把虚拟dom编译成真实dom,在通过appendChild()添加到页面中。创建虚拟DOM就是为了更好将虚拟的节点渲染到页面视图中,所以虚拟DOM对象的节点与真实DOM的属性一一照应在vue中如何用虚拟dom定义真实dom<div id="app"> <p class="原创 2022-02-07 18:33:26 · 751 阅读 · 0 评论 -
vue双向数据绑定原理
答vue.js是采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调来渲染视图。具体步骤:第一步: 需要observer(观察者)对数据对象进行递归遍历,包括子属性对象的属性,都加上 setter和getter这样的话,给这个对象的某个值赋值,就会触发setter,那么就能监听到了数据变化第二步: compile(模板解析器)解析模板指令,将模板中的变量替换成数据,然转载 2022-02-07 16:51:49 · 86 阅读 · 0 评论 -
vue的常用指令
1. vue常用指令:v-model 多用于表单元素实现双向数据绑定v-for 格式: v-for="(item,index) in/of 数组json" 循环数组或jsonv-show 显示内容 ,通过display=block/none来控制元素隐藏出现v-hide 隐藏内容 同上v-if 显示与隐藏 (dom元素的删除添加 同angular中的ng-if 默认值为false)v-else-if 必须和v-if连用v-else 必须和v-if连用 不能单独使用原创 2022-02-07 21:15:00 · 103 阅读 · 0 评论 -
v-if和v-show得区别
1. 相同点都可以控制dome元素得显示隐藏1. 区别v-if:控制dom元素得隐藏是将dom整个添加或者删除;v-show控制dom得显示隐藏是因为dom元素添加css3得display设置none或者block,dom元素还是存在的2. 性能比较v-if具有更高的切换消耗,因为它是直接添加或者删除dom的v-show具有更高的初始化渲染消耗,它渲染出来后就一直存在只是被css隐藏了3. 适用场景v-if适合运营条件不大可能改变的场景下v-show适合频繁切换v-if:在请求后台接原创 2022-02-07 21:00:00 · 355 阅读 · 0 评论 -
vue组件化开发
一般面试时问道组件怎么回答?**答:**我用vue开发的所有项目,都是采用组件化的思想开发的。一般我在搭建项目的时候,会创建一个views目录和一个commen目录和一个feature目录,views目录中放页面级的组件,commen中放公共组件(如:head(公共头组件),foot(公共底部组件)等),feature目录内放功能组件(如:swiper(轮播功能组件),tabbar(切换功能组件)、list(上拉加载更多功能组件))首先,组件可以提升整个项目的开发效率。能够把页面抽象成多个相对独立的模块原创 2022-02-01 18:00:00 · 143 阅读 · 0 评论 -
mvvm和mvc
mvvm概念:mvvm是Model-View-ViewModel 的缩写,分别对应着:数据,视图,视图模型。Model是我们应用中的数据模型,View是我们的UI视图层,通过ViewModle,可以把我们Modle中的数据映射到View视图上,同时,在View层修改了一些数据,也会反应更新我们的Modle。简单理解就是双向数据绑定,即当数据发生变化的时候,视图也就发生变化,当视图发生变化的时候,数据也会跟着同步变化。以vue为例:view 对应 template,vm 对应 new Vue({…}),原创 2022-02-01 19:30:00 · 551 阅读 · 0 评论 -
vue组件通信
父传子父组件给子组件传递自定义属性,子组件通过props来接收父组件代码<son :fa-msg="msg"></son> <!-- 子组件绑定faMsg变量,注意驼峰-->import son from './Son' //引入子组件data () { return { msg: '父组件', }},components:{son},子组件代码<p>子组件接收到内容:{{ faMsg }}</p>原创 2022-01-31 16:00:00 · 119 阅读 · 0 评论 -
vue双向数据绑定原理(vue2和vue3的区别)
vue.js是采用数据劫持结合发布者-订阅者模式的方式,通过Object.defineProperty()来劫持各个属性的setter,getter,在数据变动时发布消息给订阅者,触发相应的监听回调来渲染视图。具体步骤第一步: 需要observer(观察者)对数据对象进行递归遍历,包括子属性对象的属性,都加上 setter和getter这样的话,给这个对象的某个值赋值,就会触发setter,那么就能监听到了数据变化第二步: compile(模板解析器)解析模板指令,将模板中的变量替换成数据原创 2022-01-30 19:15:00 · 821 阅读 · 0 评论 -
vue中Computed、Methods、Watch区别
computed计算属性 计算结果会缓存,只有当依赖值改变才会重新计算对于任何复杂逻辑,你都应当使用计算属性// 而是依赖于属性的,就是一个属性的封装,属性的值不变化,那么不会多次调用computed,所以性能更好计算属性默认只有getter,可以在需要的时候自己设定setter:computed: { fullName: { // getter get: function () { return原创 2022-01-29 19:37:58 · 106 阅读 · 0 评论 -
vue深度监听watch
watch可以让我们监控一个值的变化,从而做出相应的反应 <div id="app"> 用户名:<input type="text" v-model='person.name'> <button @click='person.age++'>+</button> <p>你的名字是:{{person.name}}</p> <p>你的年龄是:{{perso原创 2022-01-30 13:00:00 · 239 阅读 · 1 评论 -
vue的虚拟dom
概念:通过js创建一个Object对象来模拟真实DOM结构,这个对象包含标签名 (tag)、属性 (attrs) 和子元素对象 (children) 三个属性,通过vue中的render()函数把虚拟dom编译成真实dom,在通过appendChild()添加到页面中虚拟dom可以简单的用一句话概括,就是用普通的js对象来描述DOM结构,因为不是真实DOM,所以称之为虚拟DOM创建真实DOM成本比较高,如果用 js对象来描述一个dom节点,成本比较低,另外我们在频繁操作dom是一种比较大的原创 2022-01-29 19:30:23 · 123 阅读 · 0 评论 -
vue的虚拟diff算法
概念diff算法就是进行虚拟节点对比,并返回一个patch对象用来存储两个节点不同的地方,最后用patch记录的消息去局部更新Dom而Vue3只比较发生变化的节点 当节点一旦发生改变 会给一个变量 效率大大提高...原创 2022-01-29 19:26:40 · 1013 阅读 · 0 评论 -
vue修改数据页面不重新渲染数据怎么办?
使用vue,经常遇到几次修改了对象的属性后,页面不重新渲染直接添加属性的问题<template> <div> <p v-for="(value,key) in item" :key="key"> {{ value }} </p> <button @click="addProperty">动态添加新属性</button> </div></template><scri原创 2022-01-28 10:29:37 · 5552 阅读 · 1 评论 -
vue的生命周期
创建前:beforeCreate() 只有一些实例本身的事件和生命周期函数创建后:Created() 是最早使用data和methods中数据的钩子函数挂载前:beforeMount() 指令已经解析完毕,内存中已经生成dom树挂载后:Mounted() dom渲的数据已经同步更新前:beforeUptate() 当data的数据发生改变会执行这个钩子,内存中的数据是新的,页面是旧的更新后:Updated() 内存和页面都是新的销毁前:beforeDestroy() 即将销毁data和metho原创 2022-01-26 11:47:31 · 159 阅读 · 0 评论 -
组件的data必须是一个函数
实列和组件data的区别vue实列中的data属性即可以是一个对象也可以是一个函数组件中定义的data属性只能是一个函数const app = new Vue({ el:"#app", // 对象格式 data:{ foo:"foo" }, // 函数格式 data(){ return { foo:"foo" } }})vue组件可能会有多个实列,采用函数返回一个全原创 2022-01-26 11:44:42 · 1037 阅读 · 0 评论 -
js的继承
实现继承首先需要一个父类,在js中实际上是没有类的概念,在es6中class虽然很像类,但实际上只是es5上语法糖而已原型链继承父类的实列作为子类的原型function Woman(){ }Woman.prototype= new People();Woman.prototype.name = 'haixia';let womanObj = new Woman();优点简单易于实现,弗雷的新增的实列与属性子类东鞥访问缺点1. 可以在子类中增加实例属性,如果要新增加原型属性和原创 2022-01-26 11:39:07 · 149 阅读 · 1 评论 -
null和undefined的区别
相同性:在JavaScript中,null 和 undefined 几乎相等在 if 语句中 null 和 undefined 都会转为false两者用相等运算符比较也是相等console.log(null==undefined); //true 因为两者都默认转换成了falseconsole.log(typeof undefined); //"undefined" console.log(typeof null); //"object" console.log原创 2022-01-26 11:06:41 · 107 阅读 · 2 评论 -
for...in和for..of的区别
for…in和for…of的区别:首先for…in取key,for…of取value从遍历数组角度来说,for…ini便利出来的是key,for…of便利出来的是value(即数组的值)var arr = [99,88,66,77];for(let i in arr){ console.log(i); //0,1,2,3}for(let i of arr){ consoel.log(i); //99,88,66,77}从便利字符串来说同数组一样。从便利对象原创 2022-01-26 09:56:44 · 369 阅读 · 0 评论 -
javascript数组的几种方法
javascript数组方法push()可以接收一个或者多个参数将参数追加到数组的尾部,返回添加后的数组长度原数组会发生改变。pop()从数组尾部删除一个元素返回这个被删除的元素,原数组发生改变。unshift()可以接受一个或者多个参数将参数放到数组的头部,返回添加后的数组长度shift()从数组头部删除一个元素,返回这个被删除的元素,原数组发生改变。slice()截取类 如果不传参数,会返回原数组;如果一个参数,从该参数表示的索引开始截取,直至数组结束,返回这个截取数组,原数组不变;原创 2022-01-20 17:54:26 · 116 阅读 · 0 评论 -
检测数据类型的几种方式
检测数据类型有四种方法typeof、instanceof、constructor、Object.prototype.toString.call()、jquery.type()typeofconsole.log( typeof 100, //"number" typeof 'abc', //"string" typeof false, //"boolean" typeof undefined, //"undefined" typeof null, //"obj原创 2022-01-20 16:08:08 · 3160 阅读 · 0 评论 -
数据类型,堆栈存储,对数据类型计算和手写深拷贝
首先我们要知道js的数据类型有哪些?js的数据类型分为两种基本数据类型:NumverStringBooleanUndefinedNullSymbol(es6新增独一无二的值)Biglnt(es10新增)引用数据类型:object但是object又包括object、Array、function、Date、RegExp(正则表达式)基本数据类型又称为值类型栈堆存储值类型存储:主要针对(Number,Starting,Boolean)三种数据类型。直接原创 2022-01-19 19:21:49 · 396 阅读 · 0 评论 -
宏任务与微任务的相关问题
首先什么宏任务和微任务宏任务:setTimeout , setInterval , Ajax , Dom 事件微任务:Promise , async / await执行顺序:微任务要比宏任务要早(优先执行微任务)js:最先执行同步操作,微任务,宏任务,异步和同步的区别异步不会阻塞程序的执行,同步会阻塞程序的执行,前端使用异步的场景定时任务:setTimeout,setInverval网络请求:ajax请求,动态《img》加载事件绑定://ajax请求代原创 2022-01-19 10:50:36 · 682 阅读 · 0 评论 -
一文搞懂js的垃圾回收机制和内存泄露问题
垃圾回收机制浏览器的javascript具有自动垃圾回收机制也就是说执行环境会负责管理代码执行过程中的使用内存其原理时垃圾收集器会定期找出哪些不在继续使用的变量,然后释放其内存。但是这个过程不是实时的因为其开销较大并且GC时停止响应其他操作,所以垃圾回收器会按照固定的时间间隔周期性的执行。只有函数内的变量才可能被回收不再使用的变量也就是生命周期结束的变量,当然只可能是局部变量,全局变量的生命周期直至浏览器卸载页面才会结束。局部变量只在函数的执行过程中存在,而在这个过程中会为局部变量在栈或堆上分配相应的原创 2022-01-15 20:24:15 · 366 阅读 · 0 评论 -
闭包和this.指向
如何产生闭包?作用域应用的特殊情况有两种表现函数作为参数本传递函数作为返回值被返回// 函数作为返回值function create() { const a = 100 return function () { console.log(a) }}const fn = create()const a = 200fn() // 100// 函数作为参数被传递function print(fn) { const a = 200原创 2022-01-15 19:55:37 · 483 阅读 · 0 评论 -
路由token验证和路由守卫~~狂徒李四
在router文件夹下的index.js下写代码在路由模块下写以下代码// 路由守卫router.beforeEach((to, from, next) => { // if判断本地是否有token if (localStorage.getItem('token')) { next()//如果有token就直接进入下一个页面 } else {//没有token的话就判断 if (to.meta.requiredPath) {//判断该页面是否需要守卫原创 2022-01-14 16:10:49 · 756 阅读 · 0 评论 -
js爬山之作用域和自由变量~~狂徒李四
作用域的种类全局作用域js中最外层 的作用域就是全局作用域函数作用域js中可以通过函数来创建一个独立作用域称为函数作用域,函数可以嵌套,所以作用域也可以嵌套;块级作用域(es6新增)es6中新增了块级作用域但是有限制只可以写在括号内(大括号,比如:if{},for(){},while(){}…);自由变量自由变量有三个条件一个变量在当前作用域没有定义,但被使用了向上级作用域一层一层依次寻找直到找到为止如果全局作用域都没找到则报错is not defind作用域链自原创 2022-01-14 16:07:46 · 199 阅读 · 0 评论