vue 封装公用函数
Vue 函数封装
- 格式化浏览器时间
/**
* 格式化时间
* @param params
* @param blo 默认为true
* @returns {string}
* @constructor 冯刚 2019年6月12日11点01分
*/
function TimeConversion(params,blo=true){
var stamp = Date.parse(params);
var newDate= new Date(stamp);
var year = newDate.getFullYear();
var month = newDate.getMonth() + ;
var date = newDate.getDate();
var h = newDate.getHours();
var m = newDate.getMinutes();
var s = newDate.getSeconds();
if(blo)
return year + '-' + getNow(month) + "-" + getNow(date);
return year + '-' + getNow(month) + "-" + getNow(date) + " " + getNow(h) + ':' + getNow(m) + ":" + getNow(s); } - 校验字符串最后是否存在斜杠
/**
* 验证最后是否有反斜杠
* @param value
* @returns {*}
* @constructor 冯刚 2019年6月12日
*/
function Verification(value) {
if (value.length > && value !== '') {
var str = value.substr(value.length - , );
if (str !== '/' && str !== '') {
value += '/';
}
}
return value;
} - 字符串加密
/**
* 加密
* @param code 要加密的字符串
* @returns {string}
*/
function compileStr(code) {
var c = String.fromCharCode(code.charCodeAt() + code.length);
for (var i = ; i < code.length; i++) {
c += String.fromCharCode(code.charCodeAt(i) + code.charCodeAt(i - ));
}
return escape(c);
} - 字符串解密
/**
* 解密
* @param code 要解密的字符串
* @returns {string}
*/
function uncompileStr(code) {
code = unescape(code);
var c = String.fromCharCode(code.charCodeAt() - code.length);
for (var i = ; i < code.length; i++)
c += String.fromCharCode(code.charCodeAt(i) - c.charCodeAt(i - ));
return c;
} - 根据key获取浏览器地址后参数
/**
* js获取url传递指定参数,解决url中带中文乱码的问题(根据key获取value)
* @param key
* @returns {string|null}
*/
function getQueryString(key) {
var reg = new RegExp("(^|&)" + key + "=([^&]*)(&|$)", "i");
var r = window.location.search.substr().match(reg);
if (r !== null) return decodeURI(r[]); return null;
} - 文本框非空校验,文本框添加红色样式
/**
* 文本框非空验证
* @param type 自定义类型(.或#)
* @param name 页面中自定义类型名称
* @author 冯刚 2019年6月12日
*/
function isNotNull(type, name) {
var temp, select;
var isNull = false;
if (checkValue(type, name))
isNull = true;
temp = type + name;
if (!isNull)
$($(temp)).each(function () {
var _this = $(this);
_this = reductionStyle(_this);
temp = _this.children('input').val();
select = _this.children('div').children('input').val();
if (temp === '' || temp === null) {
isNull = true;
_this.children('input').css('border', 'solid red 1px');
}
if (select === '' || select === null) {
isNull = true;
_this.children('div').children('input').css('border', 'solid red 1px');
}
});
return isNull;
} - 重置初始化样式
/**
* 重置初始化样式
* @param type
* @param name
* @returns {boolean}
*/
function resetStyle(type, name) {
var temp;
var isBool = false;
if (checkValue(type, name))
isBool = true;
temp = type + name;
if (!isBool)
$($(temp)).each(function () {
var _this = $(this);
_this = reductionStyle(_this);
isBool = true;
});
return isBool;
} - 数据封装成 data 对象,并且去除空格
/**
* 封装数据
* @param data 数据对象(用于添加修改)部分可用
*/
function packData(data){
var vmData={};
for (var o in data) {
if (data[o] !== null && data[o] instanceof Array)
vmData[o]=null;
else{
if(typeof data[o] === 'string' && data[o].length > )
vmData[o]=data[o].trim();
else
vmData[o]=data[o];
}
}
return vmData;
} - 动态绑定数据
/**
* 动态赋值(用于查看编辑)
* @param orgObj
* @param newObj
* @returns {*}
* @constructor fg 2019年6月12日
*/
function AssignmentObject(orgObj, newObj){
for (var o in orgObj) {
if (!(orgObj[o] !== null && orgObj[o] instanceof Array))
{
for (var n in newObj){
if(o==n){
orgObj[o]=newObj[n];
break;
}
}
}
}
return orgObj;
} - 清空文本框内容,重置内容
/**
* 按钮重置内容
* @param data
*/
function clearContent(data) {
var v_data = {};
for (var o in data) {
if (data[o] !== null && data[o] instanceof Array)
v_data[o] = data[o];
else {
v_data[o] = null;
}
}
return v_data;
} - 部分函数校验
/**
* 内部引用 还原样式
* @param obj
* @returns {*}
*/
function reductionStyle(obj) {
obj.children('input').css('border', '1px solid #dcdfe6');
obj.children('div').children('input').css('border', '1px solid #dcdfe6');
return obj;
} /**
* 内部引用 检测选择器以及类型名称是否输入全
* @param key
* @param value
* @returns {boolean}
*/
function checkValue(key, value) {
var isBool = false;
if (isCheck(key) && isCheck(value)) {
isBool = true;
alert('请检查选择器类型及名称');
}
if (isCheck(key)) {
isBool = true;
alert('选择器类型不能为空:(./#)');
}
if (isCheck(value)) {
isBool = true;
alert('选择器名称不能为空');
}
return isBool;
} /**
* 内部引用 校验值是否为空
* @param value
* @returns {boolean}
*/
function isCheck(value) {
value = value.trim();
if (value === null || value === '' || value === 'undefined')
return true;
return false;
} - 获取当前时间
/**
* 校验时间
* @param s
* @returns {string}
*/
function getNow(s) {
return s < ? '' + s : s;
} /**
* 获取当前时间
* @returns {string}
*/
function getDate() {
var myDate = new Date();
var year = myDate.getFullYear();
var month = myDate.getMonth() + ;
var date = myDate.getDate();
var h = myDate.getHours();
var m = myDate.getMinutes();
var s = myDate.getSeconds();
return year + '-' + getNow(month) + "-" + getNow(date) + " " + getNow(h) + ':' + getNow(m) + ":" + getNow(s);
}
vue 封装公用函数的更多相关文章
- vue封装公用弹出框方法,实现点击出现操作弹出框
vue封装公用弹出框方法,实现点击出现操作弹出框 如上图所示,这次要实现一个点击出现操作弹框的效果:并将这个功能封装成一个函数,便于在项目的多个地方使用. 具体思路是: 封装一个组件,组件保护一个插槽 ...
- vue防抖节流函数---组件封装,防止按钮多次点击
1.vue 封装utils.js /** * @param {function} func 执行函数 * @param {number} time 防抖节流时间 * @param {boolean} ...
- vue 防抖节流函数——组件封装
防抖(debounce) 所谓防抖,就是指触发事件后在 n 秒内函数只能执行一次,如果在 n 秒内又触发了事件,则会重新计算函数执行时间. 节流(throttle) 所谓节流,就是指连续触发事件但是在 ...
- vue封装插件并发布到npm上
vue封装插件并发布到npm上 项目初始化 首先,要创建项目,封装vue的插件用webpack-simple很合适,vue init webpack-simple 项目名称此命令创建我们的项目的目录, ...
- 浅析vue封装自定义插件
在使用vue的过程中,经常会用到Vue.use,但是大部分对它一知半解,不了解在调用的时候具体做了什么,因此,本文简要概述下在vue中,如何封装自定义插件. 在开始之前,先补充一句,其实利用vue封装 ...
- jQuery编写插件--封装全局函数的插件(一些常用的js验证表达式)
上一篇写到了jQuery插件的3种类型,介绍了第一种类型的写法--封装jQuery对象的方法插件.这一篇要介绍第二种插件类型:封装全局函数的插件:这类插件就是在jQuery命名空间内部添加函数:这类插 ...
- delphi公用函数
{*******************************************************} { } { Delphi公用函数单元 } { } { 版权所有 (C) 2008 } ...
- wemall app商城源码Android之支付宝接口公用函数
wemall-mobile是基于WeMall的Android app商城,只需要在原商城目录下上传接口文件即可完成服务端的配置,客户端可定制修改.本文分享wemall app商城源码Android之 ...
- 使用promise手动封装ajax函数
最近在做一个单页应用,node和浏览器仅通过json传输数据,因为是只有自己用等于是锻炼一下自己,所以也不用考虑seo的问题,node端我已经写好了,但是浏览器端想要用ajax原生太麻烦,用封装的函数 ...
随机推荐
- 02-docker入门-docker常用的一些命令
在这里,有必要先对ducker在做一次介绍 ducker 是一个容器. 容器内部运行的是一个系统. 系统内部安装好了要调试 / 发布的工程,然后这个系统被打包成了一个镜像. ducker 就是这个镜像 ...
- 【转载】浅析从外部访问 Kubernetes 集群中应用的几种方式
一般情况下,Kubernetes 的 Cluster Network 是属于私有网络,只能在 Cluster Network 内部才能访问部署的应用.那么如何才能将 Kubernetes 集群中的应用 ...
- mysql 之编码配置、引擎介绍、字段操作、数据类型及约束条件
数据库的配置 # 通过配置文件统一配置的目的: 统一管理 服务端(mysqld) 客户端(client) 配置了mysqld(服务端)的编码为utf8, 那么再创建的数据库,默认编码都采用utf8. ...
- python语言(七)面向对象、异常处理
一.异常处理 python解释器检测到错误,触发异常(也允许程序员自己触发异常).程序员编写特定的代码,专门用来捕捉这个异常(这段代码与程序逻辑无关,与异常处理有关).如果捕捉成功则进入另外一个处理分 ...
- Pandas | 06 描述性统计
有很多方法用来集体计算DataFrame的描述性统计信息和其他相关操作. 其中大多数是sum(),mean()等聚合函数. 一般来说,这些方法采用轴参数,就像ndarray.{sum,std,...} ...
- 网络协议 9 - TCP协议(下)
上次了解了 TCP 建立连接与断开连接的过程,我们发现,TCP 会通过各种“套路”来保证传输数据的安全.除此之外,我们还大概了解了 TCP 包头格式所对应解决的五个问题:顺序问题.丢包问题.连接维护. ...
- nginx 配置参数优化
nginx作为高性能web服务器,即使不特意调整配置参数也可以处理大量的并发请求.以下的配置参数是借鉴网上的一些调优参数,仅作为参考,不见得适于你的线上业务. worker进程 worker_proc ...
- nginx 日志之 access_log分割
如果任由访问日志写下去,日志文件会变得越来越大,甚至是写满磁盘. 所以,我们需要想办法把日志做切割,比如每天生成一个新的日志,旧的日志按规定时间删除即可. 实现日志切割可以通过写shell脚本或者系统 ...
- Spring Boot 知识笔记(热部署)
热部署原理: 使用了两个ClassLoader,一个Classloader加载那些不会改变的类(第三方Jar包),另一个ClassLoader加载会更改的类,称为restart ClassLoader ...
- Salesforce 开发整理(六) Visualforce分页
分页的实现总体上分真分页和假分页. 所谓真分页指页面上列出来的数据就是实际查询的数据,假分页则是无论页面上一次显示多少条记录,实际上后台已经加载了所有的记录,分页只是为了展示给用户查看.今天分享一个V ...