2019年11月_Wayne8016

原创 Vue eventBus 踩坑记录

需求是这样的：当我点击 test 页面中的跳转按钮要跳转到 home 页面的时候，我希望 test 页面中的某些数据会传递到 home 页面；但是 eventBus 有一些问题：问题 1：第一次点击跳转的时候，home 页面接收不到数据；问题 2：第二次点击跳转的时候，home 页面接收到 1 遍数据，第三次点击跳转的时候，home 页面接收了 2 遍数据，第四次点击跳转的时候，...

2019-11-26 20:27:39 680

原创 Vue事件总线 eventBus

如果项目不够大，没有引入 Vuex 的情况下，组件还不是父子组件的关系，也不适合使用 params、query 等路由传参方式进行传参的话，那组件之间应该如何通信呢？公共事件总线 eventBus 的实质就是创建一个 vue 实例，通过一个空的 vue 实例作为桥梁实现 vue 组件间的通信。它是实现非父子组件通信的一种解决方案。引入方式方式一：新建一个文件，比如叫 eve...

2019-11-25 21:31:06 307

原创 Vue 父子组件互相通信

为了保证单项数据流，在 Vue 中，父子组件的关系可以总结为props向下传递，事件向上传递。即父组件通过props给子组件下发数据，子组件通过事件的方式给父组件发送信息。一，父传子1，父组件传值给子组件在父组件中，用 v-bind 动态绑定一个自定义属性，用于给子组件传递数据<template> <div class="parent"&...

2019-11-25 18:40:36 227

原创 Vue路由传参 query 和 params 方式详解

query方式：直白的来说 query 相当于 get 请求，页面跳转的时候，可以在地址栏看到请求参数；使用方式：使用 path 来匹配路由，然后通过 query 来传递参数；（也可以用 name 匹配路由）父组件： this.$router.push({ path: "/home", query: { id: 2333 ...

2019-11-25 16:51:39 716 2

原创 JavaScript 中 Object.getOwnPropertyNames() 与 Object.keys() 的区别？

大部分情况下，Object.getOwnPropertyNames() 和Object.keys() 的功能是一样的，我们一般用他们来获取对象中所有的属性，或者是获取对象中属性的个数：const obj = { aa: 1, bb: 2,};console.log(Object.keys(obj));console.log(Object.getOwnProperty...

2019-11-11 16:27:22 455

原创 JS 中，onclick 和 addEventListener 的区别？

onclick：优点简单；处理事件的 this 关键字指向当前元素；缺点只能使用冒泡事件；同一个事件，一次只能对一个元素设置一个，多了后者会覆盖前者；let cxk = document.getElementById('cxk')cxk.onclick = () => { console.log('sing')}cxk.onclick = () => ...

2019-11-10 16:50:47 695

原创 Vue，watch、computed 和 methods 的区别

在 Vue 里，computed 和 methods 很像。methods 主要是用来写函数的，多次调用多次执行。而 computed 主要是用来计算属性的，带有缓存功能，只有在第一次调用时执行，之后的调用会直接取第一次执行结果的缓存值，除非属性值发生变化。同时适用 methods 和 computed 的场景下，尽量使用 computed；任何复杂的运算也都应该放在 comput...

2019-11-10 16:36:59 201

原创 JS 继承

JS 没有类的概念，那 JS 中的继承是怎么实现的呢？其实在 JS 中，继承全靠原型链。如果大家对原型链不是很了解，可以看下我之前写的一篇文章。一，原型链继承function Person() { this.name = 'person' this.cxk = ['sing', 'dance']}Person.prototype.getName = function...

2019-11-09 23:51:40 140

原创 JS 原型链

我们每学习一个概念，不仅要知道它是什么，还要知道它是用来解决什么问题的。先说总结：JavaScript 没有类，继承全靠原型链。（即__proto__和 prototype 之间的关系）所以原型链是用来解决 JS 中的继承问题的。（指 ES6 之前，ES6以后有了 class 和 extends 语法糖）以下正式开始。在 Javascript 中，一直都有这么一种说法，万物皆...

2019-11-08 15:46:31 141

原创 JS 构造函数

1，什么是构造函数？在 JavaScript 中，用 new 关键字调用的函数，被称为构造函数。2，构造函数有什么特征？首字母大写（非强制，业界规范）；构造函数里的方法和属性由 this 来定义；3，为什么要使用构造函数？我们每学习一个新概念，不仅要知道它是什么，还要知道它解决了什么问题。先说总结：使用构造函数的目的之一是，为实现代码复用。举个例子，比如我们要为每一位同学...

2019-11-08 14:25:29 222

Wayne8016的博客