自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 路由之间传参的方法(vue通信)

1.父传子父组件中的字标签上 v-bind:定义名称="自定义传递数据名"子组件用props:{} 接收,接收是可以接收定义类型2.子传父子组件中绑定一个事件(如点击)这个事件中this.$emit("自定义事件名")这个是向父传的值父组件取值:子标签上 v-on父组件中自定义的事件名=“函数名($event)”3.$emit和$on中央事件总线通过一个空的vue实例,做中央事件总线用他来触发事件和监听事件var Event=new Vue()Event.$emit("事件名",数据)

2020-12-06 16:51:56 512 1

转载 vue路由传参的三种基本方式

现有如下场景,点击父组件的li元素跳转子组件中,并携带参数,便于子组件获取数据,父组件中:<li v-for="article in articles" @click="getDescribe(article.id)">methods:方案一: getDescribe(id){// 直接调用$router.push 来实现携带参数的跳转 this.$router.push({ path:`/describe/$(id)`, }) }方案一,需要对应路由配置如下:{

2020-12-01 12:06:13 131

原创 vue中computed和watch的区别

计算属性computed支持缓存,只有依赖数据发生改变,才会重新进行计算不支持异步,当computed内有异步操作时无效,无法监听数据的改变computed属性值会默认走缓存,计算属性是基于它们的响应式依赖进行缓存的,也就是基于data中声明过或者父组件传递的props中的数据通过计算得到的值如果一个属性是由其他属性计算而来的,这个属性依赖于其他属性,是一个多对一个或者一对一,一般用computed如果computed属性属性值是函数,那么默认会走get方法;函数的返回值就是属性的属性值;在co

2020-11-30 11:35:28 142

原创 怎么定义vue-router的动态路由?怎么获取传过来的动态参数?

可以通过query,param两种方式区别:query通过url传参,刷新页面还在;params属性页面不在params的类型:配置路由格式:/router/:id传递的方式:在path后面跟上对应的值传递后形成的路径:/router/123// 动态路由params在App.vue中<router-link :to="'/user/'+userId" replace>用户</router-link>在index.js { path:"/user/:use

2020-11-29 21:55:55 4347

原创 v-model原理

v-model本质上是 :value和v-on的结合体,就是绑定它的value,通过v-on触发,从而更新数据双向数据绑定的实现主要依赖于Object.defineproperty(),通过这个函数可以监听到get,set事件其中observer是主要的部分,用Obje.defineProperty来实现数据的劫持,然后用它的set,get方法来通知订阅者,触发update方法,从而实现更新视图订阅者模式:每一个{{name}} v-model=‘name’都会添加一个订阅者,从而监听不同部分的变化

2020-11-29 21:30:39 211

原创 谈谈你对虚拟DOM原理的理解?

什么是Virtual DOMVirtual DOM是对DOM的抽象,本质上是JavaScript对象,这个对象就是更加轻量级的对DOM的描述.为什么需要Virtual DOM既然我们已经有了DOM,为什么还需要额外加一层抽象?首先,我们都知道在前端性能优化的一个秘诀就是尽可能少地操作DOM,不仅仅是DOM相对较慢,更因为频繁变动DOM会造成浏览器的回流或者重回,这些都是性能的杀手,因此我们需要这一层抽象,在patch过程中尽可能地一次性将差异更新到DOM中,这样保证了DOM不会出现性能很差的情况.

2020-11-24 15:28:43 510

原创 防抖和节流的区别以及实现

防抖和节流的作用都是为了防止函数多次调用。一、防抖触发高频事件后 n 秒内函数只会执行一次,如果 n 秒内高频事件再次被触发,则重新计算时间举例:在百度搜索时,每次输入之后都会有相关联的信息弹出,但是不可能用户输入框内容一改变就触发的,一定是当你结束输入一段时间之后才会触发。我们先来看一个袖珍版的防抖理解一下防抖的实现:// fn 是用户传入需要防抖的函数// delay 是等待时间function debounce(fn, delay = 500) { // timer 是闭包中

2020-11-22 16:16:26 349 1

原创 留言板案例

<!DOCTYPE html><html><head> <meta charset="utf-8"> <title></title> <style> * { padding: 0; margin: 0; } body { background-color: paleviolet

2020-11-09 11:43:57 142

原创 Vue常见的面试题(小部分)

1.vue的虚拟dom?虚拟的DOM的核心思想是:对复杂的文档DOM结构,提供一种方便的工具,进行最小化地DOM操作。2.如何理解vue中MVVM模式?MVVM全称是Model-View-ViewModel;vue是以数据为驱动的,一旦创建dom和数据就保持同步,每当数据发生变化时,dom也会变化。DOMListeners和DataBindings是实现双向绑定的关键。DOMListeners监听页面所有View层DOM元素的变化,当发生变化,Model层的数据随之变化;DataBindings监听M

2020-11-03 12:09:21 94

原创 Promise原理

一、 promise应用场景1 解决回调地狱比如我们经常可能需要异步请求一个数据之后作为下一个异步操作的入参getData(function(a){ getMoreData(a, function(b){ getMoreData(b, function(c){ getMoreData(c, function(d){ getMoreData(d, function(e){ .

2020-10-29 22:34:35 51

转载 观察者和发布订阅模式的区别

观察者和发布订阅模式的区别观察者模式和发布订阅模式有什么区别?大多数的回答都是:Publishers + Subscribers = Observer Pattern,24种基本的设计模式并没有发布-订阅模式,发布订阅模式属于并发型模式;像典型的Mq;这两种相似单并不可以划等号。我们来重新来回顾一下这两种模式:Observer Pattern观察者模式定义了对象之间的一对多依赖,这样一来,当一个对象改变状态时,它的所有依赖者都会收到通知并自动更新。而观察者模式属于行为型模式,行为型模式关注的是对象

2020-10-29 18:26:28 312

原创 js浅拷贝与深拷贝的区别和实现方式

如何区分深拷贝与浅拷贝,简单点来说,就是假设B复制了A,当修改A时,看B是否会发生变化,如果B也跟着变了,说明这是浅拷贝,拿人手短,如果B没变,那就是深拷贝,自食其力。1. 如果是基本数据类型,名字和值都会储存在栈内存中var a = 1;b = a; // 栈内存会开辟一个新的内存空间,此时b和a都是相互独立的b = 2;console.log(a); // 1当然,这也算不上深拷贝,因为深拷贝本身只针对较为复杂的object类型数据。2. 如果是引用数据类型,名字存在栈内存中,值存在堆内

2020-10-28 23:11:57 121

原创 cookie,sessionStroage和localStorage三者的区别

背景介绍SessionStorage, LocalStorage, Cookie这三者都可以被用来在浏览器端存储数据,而且都是字符串类型的键值对。 区别在于前两者属于WebStorage,创建它们的目的便于客户端存储数据。 而Cookie早在网景公司的浏览器中就开始支持,最初目的是为了保持HTTP的状态。Cookie(也叫Web cookie或者浏览器Cookie)是服务器发送到用户浏览器并保存在浏览器上的一块数据, 它会在浏览器下一次发起请求时被携带并发送到服务器上。比较经典的,可以它用来确定两次.

2020-10-27 15:28:57 323

原创 WEB_面试题

JS交互 问题汇总1.JS中能够实现跟服务器后台交互的手段有哪些?Asynchronous Javascript And XML js的异步请求对象script标签的src属性location.href, assign replace, window.open() , background-image:url("") , form表单 , 超链接 跳转到服务器程序 , img 的src属性 , video和audio 的src属性 , link的href , iframe(了解)form表单交互

2020-10-25 22:39:16 5411

原创 jQuery中的事件委托

什么是事件委托?事件委托是利用事件冒泡,只指定一个事件处理程序来管理某一类型的所有事件。为什么要用事件委托?1.在JavaScript中添加到页面上的事件处理程序的个数直接关系到页面的整体运行性能。为什么呢?因为,每个事件处理函数都是对象,对象会占用内存,内存中的对象越多,性能就越差。此外,必须事先指定所有的事件处理程序而导致的DOM访问次数,会延迟整个页面的交互就绪时间。2.对有很多个数据的表格以及很长的列表逐个添加事件,简直就是噩梦。所以事件委托,能极大地提高页面的运行性能,减少开发人员..

2020-10-17 15:45:54 2896

原创 WEB_javascript部分面试题

1.IE和标准下有哪些兼容性的写法?Var ev = ev || window.eventdocument.documentElement.clientWidth ||document.body.clientWidthVar target = ev.srcElement||ev.target2.事件委托是什么?利用冒泡的原理,把事件加到父级上,触发执行效果。通俗的讲,事件就是onclick,onmouseover,onmouseout,等就是事件,委托呢,就是让别人来做,这个事件本来是加在某

2020-09-02 11:35:21 177

空空如也

空空如也

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

TA关注的人

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