liuhua_2323的博客

由于时间太晚了，我早已是睡眼朦胧，不多说了，直接上代码。大家都知道vuex的state、getters、mutations、actions吧，不知道的也没关系，官网走一波。先看整体目录结构：下面我们来看看每个文件中是怎么操作的：index.js:import Vue from 'vue'import Vuex from 'vuex'import state from ...

最近有一个需求，需要支持导入导出excel。导入嘛，没多想，直接调用了公司封装好了轮子，嗯，挺好用，三步就搞定了，但是导出，我找了又找，没有在公司的组件库中发现蛛丝马迹

武汉解封，又是一年春好色！不管有事没事，我总喜欢把公司的项目拿出来da东看看，西点点，或许我是做测试的命吧。今天发现了一个问题，谈不上bug，但是体验不好。下面先上图，看看问题所在，（敏感数据已做处理）全屏下是这个样子的，中规中矩，看起来还行：如果我们把侧边栏打开，他就成了这个鬼样子：不用多说，想必大家已经知道问题所在了吧，下面的table用的是el-row + el-co...

我们在使用Vue做项目开发的时候，路由这一块肯定是少不了的。我们是否真正去考虑过、设计过如何才能整一个漂亮的、高扩展性的路由。可能很多开发者不以为然，认为路由嘛，不久是那么回事嘛，直接开撸就完事了，如果后期有什么需求，加什么页面，再随便加个路由，指向一个页面就行了。那么我可以很明确的告诉你，小项目这么干，可能问题不大，如果稍微大一点的项目，几百个路由的时候，你不做区分，不做规划，那么可能你自己...

递归组件递归组件就是指组件在模板中调用自己，开启递归组件的必要条件，就是在组件中设置一个name选项。比如下面的示例：<template> <div> <my-component></my-component> </div></template><script>export de...

写在开头你可能用过jsfiddle或jsbin之类的网站，在里面你可以用 CDN 的形式引入 Vue.js，然后在线写示例。不过，这类网站主要是一个 html，里面包含 js、css 部分，渲染则是用 iframe 嵌入你编写的 html，并实时更新。在这些网站写示例，是不能直接写.vue文件的，因为没法进行编译。来看另一个网站iView Run，它是能够在线编写一个标准的...

我们创建Vue实例时，都会有一个el选项，来指定实例的根节点，如果不写el选项，那组件就处于未挂载状态。Vue.extend的作用，就是基于 Vue 构造器，创建一个‘ 子类 ’，它的参数跟new Vue的基本一样，但data要跟组件一样，是个函数，再配合$mount，就可以渲染组件，并且挂载到任意指定的节点上，比如body（这是单文件组件做不到的）下面我们就来看两个例子：1.在单文件组...

Vue.js 1.x 的 $dispatch 与 $broadcast虽然 Vue.js 1.x 已经成为过去时，但为了充分理解本节通信方法的使用场景，还是有必要来了解一点它的历史。在 Vue.js 1.x 中，提供了两个方法：`$dispatch` 和 `$broadcast` ，前者用于向上级派发事件，只要是它的父级（一级或多级以上），都可以在组件内通过 `$on` （或 events...

组件的构成一个再复杂的组件，都是由三部分组成的：prop、event、slot，它们构成了 Vue.js 组件的 API。如果你开发的是一个通用组件，那一定要事先设计好这三部分，因为组件一旦发布，后面再修改 API 就很困难了，使用者都是希望不断新增功能，修复 bug，而不是经常变更接口。如果你阅读别人写的组件，也可以从这三个部分展开，它们可以帮助你快速了解一个组件的所有功能。属性 pro...

今天向大家介绍另外一种组件之间通信的方法，也就是 findComponents 系列方法，它并非Vue.js内置，而是需要自行实现的，我们以工具函数的形式来使用，它是一系列的函数，可以说是组件通信的终极方案。findComponents 系列方法最终都是返回组件的实例，进而可以读取或调用该组件的数据和方法。它的适用场景：--由一个组件，向上找到最近的指定组件--由一个组件，向上找到所有...

scoped：Vue-loader，使Vue 可以使用类似于 Web Component 的组件化写法,<template></template><style></style><script></script>，并且为组件中的 style 标签增加一个 scoped 标识。Vue-loader 在编译的过程中会为组...

上一篇文章中我们实现跨级组件之间的通信是通过Bus（中央事件总线）的方式来实现的，是需要引入三方文件（额外的js文件）的，今天我将向大家介绍一种无依赖的组件通信方法，Vue.js内置的provide/inject接口。provide/inject是Vue.js2.2.0版本后新增的API，这里我就简单介绍一下：provide：Object | () => Object injec...

对于vue来说，组件之间的通信是非常重要的，也是让人非常头痛的，下面我就总结一些常用的组件之间通信的方法。1.props父组件向子组件发送消息//父组件<template> <div> <Btn :val="msg" index="静态"></Btn> </div></template><...