ElementUI

Element 通知组件 Notification 支持同类型的提示信息只弹出一次!!!

当我们在使用 Element Notification 通知组件的时候,由于该组件不是通过实例化来创建的,当有事件触发通知时我们就无法控制在同一个页面相同的消息只弹出一次,我们必须使用其它的手段来实现。能否通过一个标识来记录当前页面已经触发通知,我们根据这个标识来判断是否再次弹出相同的提示信息。

Element UI Loading 加载组件动态变更 text 值(加载文案)

有这样的一个需求,我在上传文件的时候,上传阶段耗时较长,所以利用加载动画作为友好提示用户等待。如果我想在 loading 的时候,同时显示上传的进度值,于是我在 text 值里拼接上进度值变量,发现只显示最初的进度变量值,并没有随着变量的改变而更新视图。 官方文档里也没有提供能动态改变加载文案的 API,网上看到有人说可以使用 setText 来设置 text 值,于是使用以下方法试了试,还真的可以

生成以周统计的表头,跨月份的周算在后一个月

这是人力统计的一个表格的表头,根据月份,划分周,每周从周一开始到周日(国内习惯性)。而跨月份的周算在前一个月还是后一个月,我们的需求是算在后一个月。根据情况而定。

ElementUI 为 DatePicker 日期选择器组件添加前缀说明文字

当我们使用 ElementUI 构建表单页面的时候,经常需要使用到复合型输入框,可前置或后置元素,一般为标签或按钮,作为该输入框的说明性文字。 但是 DatePicker 日期选择器组件并没有提供 Slot 来让我们添加同样的解释性文字,如果只是用 placeholder 说明,当选择日期后我们并不知道该区域是干什么的。 想达到 Input 组件同样的 UI 效果,好像只能自己想办法了。(有点疑惑,为什么日期组件官方没有提供前置和后置 Slot 插入内容的功能,这个场景还是很常见的)

前端常用UI框架整理

越来越多的设计精美的UI框架可以帮助解决项目中快速搭建前端原型,基本覆盖常见的使用场景,即使没有覆盖到,也可通过重写CSS来定制你想要的组件。

Element table 实现点击任何一处展开行功能

正常默认是点击行前面的向右箭头展开行,但是从用户体验上好像不是很人性化,产品经理需要点击整行的任何一处,即可展开。 实现也不是不可能,table组件提供很过的API和属性,通过组合即可实现。先设置行的 row-key 属性,然后利用 expand-row-keys 属性来控制当前展开的行,它是一个数组,可控制多行展开。最后通过 row-click 事件API来触发更新 expand-row-keys 数组。

Sidebar