![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
前端
studentenglish
前端开发
展开
-
Vue进阶----Vuex的高阶用法汇总
目录结构如下:其中vuex相关的三个文件counts.js、 index.js、 operate.js,内容如下:index.jsimport Vue from 'vue'import Vuex from 'vuex'import counter from './counter.js'import operate from './operate.js'Vue.use(Vuex)...原创 2019-12-05 00:49:51 · 1541 阅读 · 0 评论 -
Vue组件之间传值的11种方式总结
vue组件间的传值方式多种多样,并不局限于父子传值、事件传值这些。我们对vue项目中的传值方式进行了整理总结,具体如下:provide / injectprops (父传子)$emit (子传父)eventBus (全局vue实例对象)vuex (状态管理)$parent / $children / ref (获取组件实例)$attrs$listenersVue.obser...原创 2019-12-05 00:30:17 · 2530 阅读 · 0 评论 -
vue中使用window.eventBus事件重复触发的问题
vue中数据传输,会用到window.eventBus进行全局事件传递,emit和on全局事件的数据传递。但是如果使用不当,会造成时间重复触发。场景如下:在main.js中,创建vue实例,并绑定到全局变量window.$bus上。window.$bus = new Vue()在a.vue中设置触发事件window.$bus.$emit('user_task_change')...原创 2019-10-15 17:04:38 · 2005 阅读 · 0 评论 -
Vue进阶-- 手写一个动态配置的加载插件并发布到npm,附使用说明文档
插件开发请参考:1.官方文档: 传送门2. 我上一篇简单实例介绍: https://blog.csdn.net/studentenglish/article/details/98125385插件发布到npm看这一篇就够了:传送门 (转载)插件效果:安装:npm install vue-loading-plug --save-dev使用1.在路口文件main.jsimport V...原创 2019-09-01 19:44:14 · 525 阅读 · 0 评论 -
vue组件name属性的作用和组件递归实现数据树
<template> <div class="tree-content" v-if="data.length > 0"> <dl class="tree-part" v-for="(item, key) in data" :key="key"> <dt class="tree-item-title" v-if="item.la...原创 2019-08-29 09:42:23 · 506 阅读 · 0 评论 -
vue-lazyload使用相对图片路径无法正常加载的问题
在项目中引入vue-lazyload实现图片懒加载功能,如果使用在线图片路径则加载成功,本地路径的图片的话加载异常,如下:原因:vue-lazyload是在main.js文件中引入,不会被webpack进行编译,src中的文件会被webpack编译,包括assets,assets文件夹中的图片地址,会在编译过程中改变。因此vue-lazyload无法正确获得图片地址,就不能显示图片了。解...原创 2019-08-19 00:58:47 · 2265 阅读 · 1 评论 -
Vue进阶---写一个类似Element中Message的插件
创建项目, 安装项目并启动项目vue init webpack vue-uicd vue-uicnpm installnpm run dev项目文件夹结构在src中新建插件文件夹UI-Plugin,放置我们创建的插件,结构如下:其中: UI-Plugin --> message 放置message组件 UI-Plugin --> index....原创 2019-08-02 00:43:44 · 627 阅读 · 0 评论 -
如何查看一个textarea中输入的内容中隐藏的\t \r \n等特殊符号
场景: 今天设计一个自定义组件,实现从excel中赋值数据填入一个textarea的输入框,然后在输入框的下方用表格的形式展示出所复制的内容。问题: 如何获取复制的内容中所有内容,以及分隔符号,进行精确分离数据?如果我们已经知道复制的内容中是以\t(制表符)、\n(换行符)来进行数据的分割,那么我们可以直接获取每行的数据:但是如果我们不确定所复制的数据用了那些特殊符号进行数据分割,...原创 2019-08-02 00:14:24 · 2596 阅读 · 0 评论 -
localstorage, sessionstorage, vuex的区别和优势
sessionStorage、localStorage可以代替vuex做全局数据共享吗?首先我们先来了解一下这三者的区别和优势:区别:Vuex存储在内存localStorage(本地存储)则以文件的方式存储在本地,永久保存;sessionStorage( 会话存储 ),临时保存, 浏览器或者页面关闭,则sessionStorage被清空。vuex用于组件之间的传值,local...原创 2019-07-09 22:37:36 · 1952 阅读 · 0 评论 -
vue ---- 仿ElementUI自定义换肤,更换主题
<template> <div> <input type="color" id='selectTheme' v-model="theme"> <script type='text/template' id="themeColorInfo"> .theme-color { color: {{theme}}...原创 2019-07-12 22:26:25 · 1968 阅读 · 0 评论