- 博客(38)
- 资源 (8)
- 收藏
- 关注
RSS订阅原创 vxe-table 固定列滚动完成后没有对齐
vxe-table 固定列滚动完成后没有对齐默认情况下，虚拟滚动是自动开启的，当行数超过设置的 scroll.y.gt 时，就会自动触发虚拟渲染（即只渲染可视区内的数据），所以要想将性能达到最优，应该确保可视区内的显示条数尽可能减少，建议在 20 条以内渲染性能是非常流畅的。对于设置固定列的场景，由于固定列和主体是两个区域；默认的 scroll 行为是即时渲染的，所以当渲染量达到一定程度时，会产生当前滚动的速度与固定区域的速度不一致，渲染中的空白区。vxe-table 虚拟滚动可以设置两种模式：浏
2021-06-07 09:17:02
4069
1
原创 xe-utils 多个字段组合排序
js 对数组进行多个字段组合排序支持任意字段组合排序，升序或倒序混合排序var list = [ { a: 55, b: 33, c: 44 }, { a: 11, b: 66, c: 22 }, { a: 55, b: 66, c: 22 }, { a: 55, b: 66, c: 24 }, { a: 55, b: 87, c: 22 }, { a: 89, b: 46, c: 22 }, { a: 44, b: 66, c: 28 }]XEUtils.orderBy
2020-10-27 16:38:35
686
原创 vxe-table 多字段组合排序
vxe-table 多字段组合排序默认是单列排序的那么如何支持多列组合排序呢？可以通过 sort-config.multiple = true 开启多列组合排序功能，该功能需要 v3.0+ 才能支持；启用后就可以多列组合排序，升序或倒序组合排序<vxe-table border height="300" :sort-config="{multiple: true}" :data="tableData"> <vxe-table-column type="
2020-10-24 19:17:38
3904
原创 vxe-table 国际化的使用、支持多语言 internationalization
vxe-table 国际化的使用、支持多语言 internationalization先安装 vue-i18n 国际化插件npm install vue-i18nimport Vue from 'vue'import VueI18n from 'vxe-i18n'import VXETable from 'vxe-table'import zhCN from 'vxe-table/lib/locale/lang/zh-CN'import enUS from 'vxe-table/lib/
2020-09-29 21:18:12
2513
原创 vxe-input vue 日期选择组件带农历节日、小圆点提醒
vxe-table vxe-input vue 日期选择组件带农历节日、小圆点提醒默认的日期选择是没有节日信息的可以通过 festival-method 方法自定义节日信息，接收一个对象，用于渲染当前的事件，例如：{ // ... methods: { // ... festivalMethod ({ date }) { const dateMaps = { 20200801: { important: true, // 是否标记为重要节日 label
2020-08-04 11:34:52
5112
1
原创 vxe-table vue 中支持虚拟滚动组件：虚拟列表、虚拟树、横向与纵向虚拟滚动的列表与表格组件
vxe-table vue 目前为止唯一能全能支持虚拟滚动的组件：虚拟列表、虚拟树、横向与纵向虚拟滚动的表格组件目前主流的数据驱动框架 react、vue …等虽然入门相当简单；例如 vue 中，由于数据双向的原因，需要对数据进行双向监听，从而使渲染性能大幅下降，如果数据量稍微大一点，页面基本上是直接卡死，那么如何解决呢？虚拟组件由此诞生，只渲染当前可视区的内容，其余的收起，当滚动到指定位置时才渲染对应的节点，即时 vue 的双向绑定会损耗性能，由于 dom 节点的大幅减少，也不会对性能造成影响，从而流
2020-06-13 16:10:46
21792
9
原创 vue 使用打包 js 报错、 uglifyjs-webpack-plugin 压缩报错的解决方法
vue 项目可以正常启动运行，但是打包时却 js 报错，因为 uglifyjs-webpack-plugin 不支持新的 es6 法Error in from UglifyJs UnexpectedundefinedBuild failed with errors.解决方法，使用新的 terser-webpack-plugin 创建替换 uglifyjs-webpack-pluginnpm install terser-webpack-plugin -D...
2020-06-09 00:29:45
4011
2
原创 xe-utils 解决 js 加减乘除精度问题，计算精度不准问题解决
xe-utils 解决 js 加减乘除精度问题，计算精度不准问题解决小数加法，例如var num1 = 17.67 + 1.3// 18.970000000000002var num2 = XEUtils.add(17.67, 1.3)// 18.97小数减法，例如var num1 = 18.97 - 1.3// 17.669999999999998var num2 = XEUtils.subtract(18.97, 1.3)// 17.67小数乘法，例如var num1 =
2020-06-04 15:18:03
1777
原创 jspdf 中文乱码、支持中文的解决方案，支持中文、日语、韩语等多国字体语言...
jspdf 支持中文的解决方案，支持中文、日语、韩语等…默认情况下，jspdf 只支持 ASCII-codepage 编码，如果用了中文就会导致出现乱码，jspdf 虽然不支持中文字体，但是支持添加字体库，那么我们就可以通过设置字体库来彻底解决中文乱码的问题。<script src="https://cdn.jsdelivr.net/npm/jspdf"></script>var doc = new jsPDF();doc.text(20, 20, '支持简体中文、支持繁體
2020-05-30 11:26:00
12653
3
原创 vxe-list vue 实现下拉框的虚拟列表
vxe-table vxe-list vue 实现海量虚拟下拉框虚拟列表的实现原理：只渲染可视区的 dom 节点，其余不可见的数据卷起来，只会渲染可视区域的 dom 节点，提高渲染性能及流畅性，优点是支持海量数据的渲染；当然也会有缺点：滚动效果相对略差（海量数据与滚动效果的取舍问题就看自己的需求喽）；<div class="my-select"> <input typ...
2020-05-05 10:41:05
3998
3
原创 vxe-list vue 实现虚拟列表、虚拟滚动、滚动渲染
vxe-table vxe-list vue 实现高性能的虚拟列虚拟列表的实现原理：只渲染可视区的 dom 节点，其余不可见的数据卷起来，最大程度的减少 dom 节点，提高渲染性能及流畅性，优点是支持海量数据的渲染；当然也会有缺点：滚动效果相对略差；<vxe-list height="240" class="my-list" :loading="loading1" :data="lis...
2020-04-21 19:34:11
7008
1
原创 vxe-table 如何格式化单元格内容，全局可复用的格式化方法
vxe-table 如何格式化单元格内容，全局可复用的格式化方法一般情况下通过表格渲染列表后，经常需要对单元格的内容进行格式化，比如格式化数值、字典转换…等，在 vxe-table 支持的格式化有 n 种，不同场景可以选择最优的方式方法1：直接对源数据进行转换，该方式的性能最优，写法相对冗余<vxe-table :data="tableData"> <vxe-tab...
2020-03-07 11:28:59
13966
5
原创 vue vxe-table vxe-modal 模态窗口、最大化窗口，缩放拖动窗口
查看官网示例：https://xuliangzhan_admin.gitee.io/vxe-table/#/table/module/modal<vxe-button @click="value2 = !value2">拖动窗口调整大小</vxe-button> <vxe-modal v-model="value2" resize> <te...
2020-02-08 23:01:12
11607
原创 vue vxe-table vxe-form 表格，折叠表单，表格校验，动态生成表单，表单配置
查看官网示例：https://xuliangzhan_admin.gitee.io/vxe-table/#/table/grid/fullEdit<vxe-form :data="formData4" title-align="right" title-width="100" @submit="searchEvent" @reset="resetEvent"> <vxe...
2020-02-08 22:43:34
15123
2
原创 elx-table elx-editable vxe-table 常见报错信息
elx-table elx-editable vxe-table 常见报错信息vue-element-extends 报错 ，需求将使用 vue 2.6+ 以上版本vue.runtime.esm.js?2b0e:1737 TypeError: Cannot read property ‘key’ of nullError in render: “TypeError: Cannot crea...
2019-05-21 10:17:18
3135
原创 vue vxe-table 一个 PC 端表格组件，大数据表格
vxe-table vue table 一个非常强大表格组件一个功能更加强大的 Vue 表格组件查看 vxe-table功能点基础尺寸斑马线条纹带边框单元格样式列宽拖动流体高度固定表头固定列固定表头和列表头分组序号单选多选排序筛选合并行或列表尾合计导出 CSV显示/隐藏列加载中格式化内容自定义模板快捷菜单滚动渲染展开行树形表格可编辑表...
2019-05-19 20:07:23
24438
15
原创 vxe-table 启用虚拟滚动加载大数据表格
vxe-table vxe-excel 实现 Excel 表格，增删改查查看 Github查看 Demo
2019-05-12 22:34:05
13523
9
原创 vxe-table vue 增删改查表格组件
查看 Github功能点：支持单列编辑支持整行编辑支持手动、单击、双击编辑模式支持渲染简化的内置组件支持渲染任意自定义组件支持动态列渲染支持数据校验（同步、异步）支持显示列数据 change 状态支持增/删/改/查/还原支持原 ElTable 所有参数及功能APIEditable Attributes&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;
2019-01-26 19:49:40
19314
17
原创 将 vue-cli 2 项目升级 webpack4
Vue 项目升级 webpack4Github项目地址由于 vue-cli 2 构建的项目是基于 webpack3，所以只能自己动手改动，至于升级 webpack4之后提升的编译速度以及各种插件自己去体验。修改配置替换插件 extract-text-webpack-plugin，使用 webpack4 推荐使用的插件 mini-css-extract-pluginbuild/webp...
2018-11-22 23:31:12
3341
原创 基于 vue-cli 2 实现，vue 项目支持一键部署
vue 项目基于 WinSCP 脚本实现一键部署Github项目地址服务器系统 ubuntu（如果是其他发行版脚本需另写）项目部署在 nginxvue 项目，基于 vue-cli 2 脚手架使用 FileManagerPlugin 打 zip 包以 blog 为例子：nginx 部署目录：/home/website/blog/www/包的上传目录：/home/upload/在...
2018-10-29 14:50:09
2224
原创 解决 vue 项目启动后不能被外部IP访问
解决 webpack-dev-serveri 启动后通过外部访问报错 invalid host header修改 config/index.js 的 host 属性为 ‘0.0.0.0’{// ...,host: '0.0.0.0',port: 8080,// ...}修改 build/webpack.dev.conf.js 的 devServer 配置增加 disableHo...
2018-10-29 14:06:49
11266
7
原创 解决在 IOS 页面点击 input 白屏问题
在IOS 下点击input界面空白解决方法解决方法：如果使用了 position 定位，检查父元素是否有加上 position: relative;如果以上不能解决，给 input 加上input { // 解决在 ios 下点击 input 页面空白问题 -webkit-transform: translateZ(0); transform: translateZ(0);...
2018-10-13 21:15:21
1887
原创 element-ui vue-element-extends vxe-table 实现对海量数据的支持
将一个带层级的数据列表转成树结构示例 属性 描述 默认值 strict 严格模式，启用后会忽略错误数据 false key 节点键值 ‘id’ parentKey 父节点键值 ‘parentId’ children 子节点属性 ‘children’ data 数据存放属性 ‘data’...
2018-06-02 21:14:09
1889
原创 xe-utils 任意日期转换、格式化函数，IE8+
日期格式化成字符串示例 属性 描述 备注 值 yy 年份 自动截取后两位 yyyy 年份 M 月份 1~12 MM 月份 自动补0 1~12 d 日 1~31 dd 日 自动补0 1~31 h 12小时制 1~12.
2018-06-02 21:00:05
1989
原创 xe-ajax 调用jsonp 跨域请求jsonp服务调用
Github跨域的安全限制都是对浏览器客户端的，服务器端是不存在跨域安全限制的。如果协议，端口和主机对于两个页面是相同的，则两个页面具有相同的源，否则就是不同源的。Rest 的跨域需要服务端支持CORSjsonp 跨域的实现方式可以通过 创建 script 标签调用例如：调用一个的公告服务服务端接口：http://xuliangzhan.com/jsonp/announ...
2018-05-04 17:53:01
529
原创 element-ui vue-element-extends elx-editable 增删改查、导出数据
// 计算两个日期之间相差多久var dateDiff = XEUtils.getDateDiff('2018-01-01', '2018-01-02 10:30:00')// {'yyyy': 0, 'MM': 0, 'dd': 1, 'HH': 10, 'mm': 30, 'ss': 0, 'S': 0}// 如果结束日期小于开始日期则返回 {done: false}// 倒计时实现...
2018-05-04 15:04:57
2510
6
原创 xe-utils 计算：年份、月份、周、天、每月天数、月的第几周、年的第几天、年的第几周、日期倒计时、日期至今差距计算、任意日期格式化
var date = '2018-01-01'// 获取上一个月XEUtils.getWhatMonth(date, -1) // 2017-12-01// 获取上两个月XEUtils.getWhatMonth(date, -2) // 2017-11-01// 获取上一个月的月初XEUtils.getWhatMonth(date, -1, 'first') // 2017-12-0...
2018-05-04 14:57:57
2278
原创 Vue 移动端中解决IOS下软键盘收起或失焦后推上去的位置没有还原
// 解析 url 为对象XEUtils.parseUrl('http://xxx.com:8080/demo/demo.html?id=1')// {// 'href': 'http://xxx.com:8080/demo/demo.html?id=1',// 'hash': '',// 'host': 'xxx.com:8080',// 'hostname': 'x...
2018-05-04 14:55:14
1115
原创 Web内容安全策略CSP(Content-Security-Policy)
参数： name: 键 value: 值 path: 路径 domain: 作用域 secure: 设置为安全的,只能用https协议 expires: 过期时间,可以指定日期或者字符串，默认天// 获取所有XEUtils.cookie()// 根据name获取XEUtils.cookie('name')// 删除XEUtils.cookie('name', null, ...
2018-05-04 14:22:40
1980
原创 前端 fetch 异步通信的未来，更简洁异步请求 API
前端 fetch 异步通信的未来，更简洁异步请求 API兼容性： fetch 还属于早期阶段，目前只有部分高版本浏览器实现该接口Chrome43+、Edge14、Firefox40+、Opera29+、Safari10+先来看一个使用 XMLHttpRequest 发送异步请求例子：var xhr = new XMLHttpRequest()xhr.onreadystatechange = fu...
2018-02-03 20:41:13
361
原创 xe-ajax 异步请求库
最新版本见Github，点击查看历史版本 基本函数 ajax ( options ) fetch ( url[, options] ) doAll ( iterable ) 并发多个 setup ( options ) 全局参数设置 interceptor 拦截器 AbortController 如何取消请求 Progress 上传/下载进度监听 便捷...
2018-02-01 22:14:41
3194
2
原创 xe-clipboard 基于 H5 纯 js 实现复制文本到剪贴板
最新版本见 Github支持常用 H5 的浏览器IE、Chrome、Firefox、Opera、Safari、IOS、Android，轻量级剪贴板复制函数。 npm install xe-clipboard --saveimport XEClipboard from 'xe-clipboard'<script src="https://cdn.jsdelivr.net...
2018-01-26 16:31:08
1409
原创 前后端分离开发，使用 ajax+mock 模拟后台接口数据
vue+xe-ajax+mock 前后端分离现状开发模式强耦合，比如：用户提个需求，后台接口还没完成前端就没法开工，开发效率大大降低服务接口严重依赖后端，接口一旦变动前端联调困难前后端分离前后端通过异步接口ajax来交互前后端都各自有自己的开发流程，构建工具，单元测试等前后端完全独立运作，前端使用Mock虚拟服务与后端解耦Vue 与后台交互常用插件有vue-resource 官方已停止维护axio...
2018-01-25 21:26:29
2855
原创 vue 使用 xe-utils 函数库
npm install xe-utils vxe-utils --save通过 Vue.use() 来全局安装import Vue from 'vue'import XEUtils from 'xe-utils'import VXEUtils from 'vxe-utils'// mounts 可以设置['cookie', 'browse', 'locat']Vue.use(...
2018-01-24 01:00:55
9722
原创 vue 使用 xe-ajax 异步请求
npm install xe-ajax vxe-ajax --save通过 Vue.use() 来全局安装import Vue from 'vue'import XEAjax from 'xe-ajax'import VXEAjax from 'vxe-ajax'Vue.use(VXEAjax, XEAjax)使用<template> <ul&g...
2018-01-24 00:55:49
2491
原创 xe-utils 函数库、工具类
最新版本见Github，点击查看历史版本XEUtils 提供一套实用的基础函数、任意格式的日期转换函数，浏览器相关操作函数等...API 全局参数 setup ( options ) 设置默认全局参数 基础函数 isNaN (val) 判断是否非数值 isFinite (val) 判断是否为有限数值 isUndefined (val) 判断 Undefin...
2018-01-23 17:15:06
14889
原创 基于 vue-cli 2 实现，vue 支持多模块项目
基于 vue-cli 2 实现，vue 多模块、vue多项目集成工程业务场景1.如果项目可能有对应多个不同UI界面;对于这样的场景你可能首先会想到，用样式主题就可以实现，基本的样式或者换肤是可以通过样式实现。但如果要实现更复杂的，比如不同两套UI的界面可能功能显示及样式都有差别，那就不得不单独拆成一个项目，但是这样又会造成每个项目很多冗余代码。2.如果项目有多个子模块(同时子模块...
2018-01-22 20:51:57
6553
13
xe-ajax3.1.3.js
2018-03-05
core.1.0.1.js
2017-12-17
es6.core.js
2017-12-09
《零基础写c语言程序设计》
2012-11-05
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人