- 博客(14)
- 资源 (5)
- 收藏
- 关注

原创 ElementUI自定义组件之左右折叠展开动画
背景我们都知道,element ui官网提供了一个上下折叠展开动画,在实现可伸缩的查询面板等业务中非常实用。美中不足的是,不支持配置左右过渡动画。而实际开发中,左右过渡动画的场景还比较多,比如左树右表(左树可收缩)等。在此,笔者参考el-collapse-transition实现,做了个简单的左右过渡动画组件。演示效果核心代码beforeEnter(el) { addClass(el, 'drawer-transition') if (!el.dat...
2021-09-16 22:56:26
7474
7

原创 自定义Tooltip 组件:根据内容长度判断是否需要提示信息
elementUI中的Tooltip组件是用于展示鼠标 hover 时的提示信息,类似于原生html的title属性。我们实际开发中一般还会在此基础上提几个需求:(1).自定义显示文本行数 (2).文本超出行数,以省略号代替,并在鼠标 hover 出现提示信息 (3).文本过长时省略后,提供相应的快捷复制功能。基于这些原因,在此对elementUI之Tooltip组件进行了简单定制化。........................
2019-01-02 15:09:21
16685
4
原创 ElementUI自定义组件之地区三级联动
由于家里变故和公司变动,近一年多没更新过博客了。近期稍有空暇,在此与有需要的朋友分享一个,基于Vue+ElementUI的地区三级联动组件。先上效果图上核心代码MbDistrictPicker.vue<template> <div class="mb-district-picker"> <el-select v-model="currentProvince" placeholder="省" v...
2020-05-29 23:45:04
1806
2
原创 java 扁平化输出json所有节点key/value
原JSON文本:{ "name": "哈利·波特", "sex": 1, "birthday": "2014-12-12", "desc": "巫师夫妇詹姆·波特和莉莉·波特的独生子", "school": { "schChName": "霍格沃茨魔法学校", "schEnName": "Hogwarts School of Witchcraft and Wizardry"...
2019-11-01 14:06:40
1183
原创 elementUI之模拟goTop组件
最近项目遇到一个问题,需要在个别出现较高垂直滚动条的页面,加入一个返回顶部的小功能。虽然利用许多Jquery插件可以实现,但是elementUI的官网本身就有一个goTop组件(奈何该组件没有开放),效果还不错,为了页面风格的一致性,准备对该组件进行了简单模拟,恰好优快云已有一位前辈对此进行了封装(vue+element-ui 回到顶部组件),而且封装的相对完善,在此对其根据个人需求进...
2019-04-24 17:33:00
498
原创 原生JS简易右键菜单
1.效果图2.kt-contextmenu.jsfunction createMenu(wrapperId, menuList) { if (!wrapperId || !menuList) { confirm("请确保入参wrapperId,menuList都存在!"); } if (!Array.isArray(menuList)) { ...
2019-03-18 18:25:15
490
原创 elementUI之tree组件定制化,实现树形下拉选
目录 1.demo页面2.组件核心:JS/CSS3.demo演示1.demo页面kt-select-tree-demo.html<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <meta content="wi
2019-01-25 15:23:29
5945
5
原创 Vue自定义组件之图片缩放
点击缩略图放大,查看原比例高清大图,是我们做完图片上传功能后经常需要遇到面对的问题,比如图片预览。虽然这个问题zoom.js这个现成插件可以帮我们解决,美中不足的是,zoom.js放大后的图片会受原img本身外层高宽限制,恰恰我们做缩略图往往会限制外层宽高以便多图呈现,并希望放大后的图片不受原img影响,基于这个问题,下面借助layer.js简单封装了一个Vue图片缩放组件。目录1...
2019-01-12 14:24:08
2008
原创 springmvc数组/集合传参方式
平时开发过程中,经常遇到要对某个表进行批量的CRUD操作,这涉及到一个前台向后台的数组/集合传值问题,方式有多种,殊途同归,简单记录下。目录1.controller核心代码2.HTML前台代码3.简单小结 1.controller核心代码 @PostMapping(value = "/findLabelBatch01") public RetRe...
2018-05-23 11:28:23
5474
原创 SpringBoot + laypage分页 + 模糊查询
之前写过一篇关于JSP调用laypage分页的博客,写的比较详细,但是也比较繁杂,正好由于新项目分页的需要,故用SpringBoot将其重写,顺便集成了模糊查询。1.效果图2.domain(实体类)package com.springboot.domian;/** * @classDesc: 区县模型 * @author: Vipin Zheng * @createDa...
2018-05-06 20:11:16
2074
1
原创 JSP + laypage分页完整案例
之前用过datatables进行过分页,尽管其功能非常完善,但是代码稍嫌复杂,样式不是很美观,不经意间发现了laypage分页插件,其对于不进行排序、模糊查询的分页代码书写非常人性化,特此记录。1.效果图2.html页面district.html<!DOCTYPE HTML><html><head> <meta ch...
2018-05-06 19:32:52
4341
9
vp-ui-vue组件库源码
2022-06-08
组件库样例vp-ui-vue
2022-06-08
JSP + laypage分页完整案例
2019-01-29
SpringBoot + laypage分页 + 模糊查询 完整案例
2018-05-06
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人