vue
张三少
让实力配得上自己的野心
展开
-
vue中引入mousedown事件和document的mousemove事件模拟table滚动条
vue项目中需要模拟表格的滚动条效果,涉及的事件就是mousedown、mouseup、mousemove;其中mousedown事件是绑定在滚动条上的,但是mousemove和mouseup事件则应该是绑定在document上,这样才能很好地实现滚动条的拖动; 首先在组件methods中定义两个函数:1、获取鼠标位置坐标: getPos(ev){ let scro原创 2017-12-14 19:21:13 · 38448 阅读 · 1 评论 -
vue中引入mousewheel事件及其兼容性处理
项目实现过程中需要对一个已经有纵向滚动条的table表格增加鼠标滚轮(mousewheel)事件,方便查看数据;其实现原理与我上一篇博客中的拖动事件类似,利用模拟出来的同一个滚动条来实现,滚动条设置的要点在于:1、滚动条与滚动槽的高度比例 应该等于 内容区(动态变化)和可视区的高度比例;滚动槽与可视区平齐,高度一样,;滚动条的高度则根据内容的高度等比例计算;2、各元素的定位采用绝对定位,其父元素采原创 2017-12-15 14:08:04 · 11948 阅读 · 0 评论 -
vue中引入vue-i18n实现国际化时与ElementUI库的兼容性问题解决方法
vue(v2.3.3)项目中引入了vue-i18n(v7.0.5)插件实现国际化多语言;同时项目中使用了ElementUI(v1.3.7)库的时间选择控件‘date-picker’,该控件的文字也需要实现国际化,Element本身具有国际化功能;但问题是Element的官方文档中提到: Element 兼容 vue-i18n@5.x,搭配使用能更方便地实现多语言切换。 默认不支持 6原创 2018-01-29 10:56:15 · 16120 阅读 · 0 评论 -
vue-router实现单页面路由原理
本文参考总结于: 1、vue-router原理分析 - https://www.cnblogs.com/yanze/p/7644631.html 2、location.hash详解 - http://blog.csdn.net/baidu_31333625/article/details/54288223 3、使用HTML5的History API - https://www.cnblogs...原创 2018-03-14 10:35:24 · 10512 阅读 · 1 评论 -
构建一个Vue插件并生成npm包初体验
    vue的插件一般用来添加全局性的功能,具体可分为:添加全局方法或者属性;添加全局资源(指令、过滤器等);通过全局 mixin 方法添加一些组件选项;在 Vue.prototype 上 添加 Vue 实例方法;创建一个库,提供自己的 API,同时提供上面提到的一个或多个功能;&nbsp原创 2018-09-09 17:18:03 · 672 阅读 · 0 评论