在项目中,总是需要用到滚动条,但windows浏览器默认的滚动条是很丑的,为了页面美观,可以考虑优化滚动条样式.  vue Element UI官方文档上并没有放出滚动条相关的示例说明,但是实际上是有这么一个组件的,可查看源码. <el-scrollbar></el-scrollbar> 将会出现滚动的内容放到上述标签内就可以了. 这里要简单的设置一下,将标签的height设为100%,查看效果的时候,会出现一个横向的滚动条,如果你不想要横向的滚动条,使用下面css属性设置就可以只…

vue-amap | 基于 Vue 2.x 与高德的地图组件 参考:https://elemefe.github.io/vue-amap/#/…

可使用 组件 <el-scrollbar></el-scrollbar> 设置 组件的样式 为 高度100% <el-scrollbar style="height:100%"> </el-scrollbar>…

scrollbar是用来替代浏览器原生滚动条的组件,element的文档中并没有对scrollbar的描述. 使用方法:以<el-scrollbar/>包裹要滚动的元素,并设置固定高度.在外部引入的css中自定义样式(写在scoped中无效).…

写在前面 找了很多Vue 进度条组件!,都不包含拖拽和点击事件,input range倒是原生包含input和change事件,但是直接基于input range做进度条的话,样式部分需要做大量调整和兼容性处理.即使做好了,将来需要修改外观,又是一番折腾. 基于以上两个原因,做了一个可以响应input和change事件(即一个是拖动进度条到某处,一个是在进度条某位置点击使其值变为该位置)的div实现的Vue组件,这样既满足了对进度条事件的需求,也带来了如有需求变动,样式修改很方便的好处. 事件响…

fx67llQuickEcharts A tool to help you use Echarts quickly! npm 组件说明 这本来是一个测试如何发布Vue组件至npm库的测试项目 做完之后发现很有意思,就稍微完善了一下成为一个简易快速构建Echarts图表的组件 基本上消灭了我之前关于Echarts渲染DOM的一堆冗余代码 功能不多后续有想法的话再考虑继续封装,github源码地址在底部,各位自行取用 使用步骤 安装 -> npm install fx67ll-quick-echar…

cube-ui 是滴滴公司的技术团队基于 Vue.js 实现的精致移动端组件库.很赞,基本场景是够用了,感谢开源!感谢默默奉献的你们. 刚爬完坑,就来总结啦!!希望对需要的朋友有小小的帮助. (一)创建一个vue项目 (1) (安装全局vue-cli,通过vue -V查看版本) npm install -g vue-cli (2)vue init 你用的模板工具 项目名称 (这里采用webpack作为模板工具) vue init webpack cubeUiPro (根据选项填写或者选择,可以按…

1.muse-ui ★6042 - 三端样式一致的响应式 UI 库 2.vuetify ★11169 - 为移动而生的Vue JS 2组件框架 3.Vux ★12969- 基于Vue和WeUI的组件库 4.mint-ui ★11283 - Vue 2的移动UI元素 5.iview ★15434- 基于 Vuejs 的开源 UI 组件库 6.element ★27685 - 饿了么出品的Vue2的web UI工具套件 7. vue-amap ★1452 - 基于Vue 2和高德地图的地图组件 8.…

前言 最近由于公司需要,需要写一个相对来说比较大型的后台管理系统.为了保证管理系统操作体验较为舒适并且项目后期益于维护,最后决定基于VUE全家桶来开发一个高度组件化的单页SPA应用. 技术选型 vue:进行数据绑定以及开发组件 vue-router: 处理页面路由 vuex: 处理各组件间的通讯 vue-resource:处理HTTP请求 element-ui:使用UI框架中部分UI组件进行快速开发 项目创建 首先我们需要保证自己电脑安装有Node运行环境 打开命令行工具,输入下面指令进行全局安…

正常情况下,子组件应该尽量减少业务逻辑,而应该将业务逻辑放到父组件里面,从而减少耦合,但是当 我们不得不用到这种情况时,可以采用下面的思路 解决方案 尽量将请求单独作为一个函数(不要将请求放到show()函数里面,show()函数只是负责组建的显示): 在进行请求的时候可以加入loading,提高体验: 当请求完毕以后,再通过this.$emit通知父组件请求完毕: 父组件这时在通过this.$refs.child.show() 显示子组件,同时隐藏自己:…