摘要：有个图表需要根据当前选择的选项展示不同的数据，效果如果图： 左边的图表要根据右边的下拉选获取对应接口数据。 算了直接放代码吧： <template> <div class="transaction-chart-comp"> <div class="tc-title chart-box-title"> 阅读全文

摘要：table等其他地方可能需要根据某个字段的值展示不同的状态，但是状态比较多的话却是需要很多的判断或者繁杂的三目判断，所以封装了一个用来展示的组件： 样式如图： 代码如下： <template> <div> <span> <span v-for="item in option" :key="item. 阅读全文

摘要：element-ui的table组件有筛选功能，可以通过关键词筛选指定条件的当前页的数据： 但是，我的需求是要在点击筛选时还要调用接口获取所有数据，看了下table组件自带的filter-method属性，它的实现原理就是遍历所有的当前页的数据，通过回调函数的形式判断当前行的数据是否和筛选条件一致， 阅读全文

摘要：有个类似穿梭框的弹窗需求，看了下element-ui的Transfer组件，和原型查了很多。所以自己写了一个，原型图如下： 估计也没人看，直接放源码防止以后遇到同样需求： <template> <div class="select-people"> <div class="left"> <div c 阅读全文

摘要：最近需要在不使用UI框架的情况下封装一个简单的表格，由于对antd-vue比较熟悉，所以仿照了antd-vue的样子写了个简化版的Table组件。 使用技术：VUE3、SCSS 用过antd-vue的都应该知道table组件主要的传参是两个：columns和dataSource，分别对应表头信息和表 阅读全文

摘要：项目中有个比较麻烦的需求： 一个表格： 能手动向表格第一行增加一行 每一行的每一列在点击某一格时要能输入 每个表单控件需要有校验功能 支持多选 可以删除所选行 保存后需要前端做一个仅前端部分的查询 原型如下： 上面这些要求看起来就很麻烦。但是更麻烦的是，这个原型还是修改过的，原来的原型已经实现功能了 阅读全文