当前位置: 首页 > news >正文

vue 项目涉及的焦点聚焦、格式化日期、判断是否为对象或数组、判断是否为空、深拷贝、节流、防抖

  • 焦点聚焦
import Vue from 'vue'
// 插件对象(必须有 install 方法, 才可以注入到 Vue.use 中)
export default {install () {Vue.directive('fofo', {inserted (el) {el = el.querySelector('input')el.focus()}})}
}
  • 格式化日期格式
export const formatDate = (time) => {// 将xxxx-xx-xx的时间格式,转换为 xxxx/xx/xx的格式 return time.replace(/\-/g, "/");
}
  • 是否在数组内
export const inArray = (search, array) => {for (var i in array) {if (array[i] == search) return true}return false
}
  • 日期转换
export const dateFormat = (fmt, date) => {const opt = {"Y+": date.getFullYear().toString(), // 年"m+": (date.getMonth() + 1).toString(), // 月"d+": date.getDate().toString(), // 日"H+": date.getHours().toString(), // 时"M+": date.getMinutes().toString(), // 分"S+": date.getSeconds().toString() // 秒// 有其他格式化字符需求可以继续添加,必须转化成字符串};let retfor (let k in opt) {ret = new RegExp("(" + k + ")").exec(fmt)if (ret) {fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))};};return fmt
}

dateFormat('YYYY-mm-dd HH:MM:SS', new Date()) ==> 2020-01-01 08:00:00

  • 判断是否为空对象
export const isEmptyObject = (object) => {return Object.keys(object).length === 0
}
  • 判断是否为对象
export const isObject = (object) => {return Object.prototype.toString.call(object) === '[object Object]'
}
  • 判断是否为数组
export const isArray = (array) => {return Object.prototype.toString.call(array) === '[object Array]'
}
  • 判断是否为空
export const isEmpty = (value) => {if (isArray(value)) {return value.length === 0}if (isObject(value)) {return isEmptyObject(value)}return !value
}
  • 对象深拷贝
export const cloneObj = (obj) => {let newObj = obj.constructor === Array ? [] : {};if (typeof obj !== 'object') {return;}for (let i in obj) {newObj[i] = typeof obj[i] === 'object' ? cloneObj(obj[i]) : obj[i];}return newObj
}
  • 节流函数
export function throttle(fn, delay = 100) {// 首先设定一个变量,在没有执行我们的定时器时为nullvar timer = nullreturn function() {// 当我们发现这个定时器存在时,则表示定时器已经在运行中,需要返回if (timer) returntimer = setTimeout(() => {fn.apply(this, arguments)timer = null}, delay)}
  • 防抖函数
export function debounce(fn, delay) {let timerreturn function() {const that = thisconst _args = arguments // 存一下传入的参数if (timer) {clearTimeout(timer)}timer = setTimeout(function() {fn.apply(that, _args)}, delay)}
}

相关文章:

vue 项目涉及的焦点聚焦、格式化日期、判断是否为对象或数组、判断是否为空、深拷贝、节流、防抖

焦点聚焦 import Vue from vue // 插件对象(必须有 install 方法, 才可以注入到 Vue.use 中) export default {install () {Vue.directive(fofo, {inserted (el) {el el.querySelector(input)el.focus()}})} }格式化日期格式 export const formatDate (time) > {// 将xx…...

软件工程知识梳理6-运行和维护

软件维护需要的工作量很大,大型软件的维护成本高达开发成本的4倍左右。所以,软件工程的主要目的就是要提高软件的可维护性,减少软件维护所需要的工作量,降低软件系统的总成本。 定义:软件已经交付使用之后,…...

docker- php7.4

安装 gd拓展 anzhuanga在Dockerfile里面安装php7.4的GD库 - 知乎 apt update apt install -y libwebp-dev libjpeg-dev libpng-dev libfreetype6-devdocker-php-source extractdocker-php-ext-configure gd \ --with-jpeg/usr/include \ --with-freetype/usr/include/docker-…...

开发一个Android App,在项目中完成添加联系人的功能,通过ContentResolver向系统中添加联系人信息。

实现步骤&#xff1a; &#xff08;1&#xff09;添加动态联系人的权限。 &#xff08;2&#xff09;创建Activity和布局文件&#xff0c;添加输入框和按钮等控件。 &#xff08;3&#xff09;完成添加联系人的功能。 代码文件如下&#xff1a; activity_main.xml文件 <!…...

Flume搭建

压缩包版本&#xff1a;apache-flume-1.9.0-bin.tar 百度盘链接&#xff1a;https://pan.baidu.com/s/1ZhSiePUye9ax7TW5XbfWdw 提取码&#xff1a;ieks 1.解压 tar -zxvf /opt/software/apache-flume-1.9.0-bin.tar.gz -C /opt/module/ 2. 修改文件名 [rootbigdata1 opt]…...

Web APIs 1 DOM操作

Web APIs 1 引入&#xff1a;const优先Web API 基本认知01 作用和分类02 什么是DOM03 DOM树04 DOM对象 获取DOM对象01 根据CSS选择器获取02 其他获取DOM元素方法 操作元素内容01 innerText 属性02 innerHTML 属性 操作元素属性操作元素的常用属性操作元素的样式属性操作表单元素…...

dvwa,xss反射型lowmedium

xss&#xff0c;反射型&#xff0c;low&&medium low发现xss本地搭建实操 medium作为初学者的我第一次接触比较浅的绕过思路high low 发现xss 本关无过滤 <script>alert(/xss/)</script> //或 <script>confirm(/xss/)</script> //或 <scr…...

从云计算到物联网:虚拟化技术的演变与嵌入式系统的融合

文章目录 一、硬件性能提升&#xff1a;摩尔定律与嵌入式虚拟化二、CPU多核技术&#xff1a;为嵌入式虚拟化提供支持三、业务负载整合&#xff1a;嵌入式虚拟化的核心需求四、降低硬件成本&#xff1a;虚拟化技术的经济效益五、软件重用与移植&#xff1a;虚拟化技术的优势六、…...

linux 文件查看 head 、 cat 、 less 、tail 、grep

查看文件详细信息 stat 文件 cat 》》适合显示小文件【行数比较少】&#xff0c;如果行数较多&#xff0c;屏幕显示不完整&#xff08;如果虚拟操作&#xff0c;是无法上下键的&#xff0c;或者滚动鼠标的&#xff0c;第三方 xsheel&#xff0c;crt 可以方向键查看&#xf…...

13.2 Web与Servlet进阶(❤❤)

13.2 Web与Servlet进阶 1. 请求与响应1.1 URL与URI1.2 HTTP请求的结构1. 结构2.后端获取访问工具类型:getHeader().toLowerCase方法1.3 响应的结构1. 结构2. 响应常见状态码3. 后端设置响应参数4. 响应的ContentType作用1.4 请求转发与响应重定向应用1. 请求转发:getRequestDis…...

记录解决报错--vue前后端分离,接口401(Unauthorized)

1.场景 前端访问不了后端接口。报错401。 2.解决步骤 ①在页面console.log(111)查看走到代码的位置没有。&#xff08;走到了&#xff0c;没问题&#xff09; ②查看vue.config.js配置。这段配置就是vue访问api的url。&#xff08;没问题&#xff09; devServer: {port: 80…...

【笔记】Android 常用编译模块和输出产物路径

模块&产物路径 具体编译到软件的路径要看编译规则的分区&#xff0c;代码中模块编译输出的产物基本对应。 Android 代码模块 编译产物路径设备adb路径Comment 模块device/mediatek/system/common/ 资源overlay/telephony/frameworks/base/core 文件举例res/res/values-m…...

部署私有知识库项目FastGPT

FastGPT 是一个基于 LLM 大语言模型的知识库问答系统,提供开箱即用的数据处理、模型调用等能力。同时可以通过 Flow 可视化进行工作流编排,从而实现复杂的问答场景。 项目文档: [快速了解 FastGpt | FastGptFastGPT 是一个基于 LLM 大语言模型的知识库问答系统,提供开箱即…...

【2024-02-02】华为秋招笔试三道编程题解

恭喜发现宝藏&#xff01;搜索公众号【TechGuide】回复公司名&#xff0c;解锁更多新鲜好文和互联网大厂的笔经面经。 作者TechGuide【全网同名】 订阅专栏&#xff1a; 【专享版】2024最新大厂笔试真题解析&#xff0c;错过必后悔的宝藏资源&#xff01; 第一题&#xff1a;找…...

银行数据仓库体系实践(8)--主数据模型设计

主数据区域中保留了数据仓库的所有基础数据及历史数据&#xff0c;是数据仓库中最重要的数据区域之一&#xff0c;那主数据区域中主要分为近源模型区和整合&#xff08;主题&#xff09;模型区。上一节讲到了模型的设计流程如下图所示。那近源模型层的设计在第2.3和3这两个步骤…...

vue在main.js中引入三方插件不生效的原因

有的时候需要比较复杂的功能,但是自己实现比较复杂的话,可以引入第三方插件.如果这个第三方插件需要全局都使用的话,可以在main.js中进行引入. 比如router elementplus之类的. import { createApp } from vue import ElementPlus from element-plus import element-plus/dist/…...

chatgpt搭建

chatgpt两步搭建大法 部署docker环境 下载docker curl -fsSL https://get.docker.com -o get-docker.sh安装docker sh get-docker.sh运行docker服务 systemctl start docker查看运行状态 systemctl status docker设置docker开机自启 systemctl enable docker部署chatgpt…...

vue基本理解

1、js闭包&#xff0c;作用&#xff1f;&#xff1f; 闭包是指在一个函数内部&#xff0c;可以访问外部函数的变量&#xff0c;即使外部函数已经执行完毕。闭包的作用有&#xff1a; 保护变量&#xff1a;闭包可以保护函数内部的变量&#xff0c;使其不受外部环境的影响。实现…...

NLP入门系列—Attention 机制

NLP入门系列—Attention 机制 Attention 正在被越来越广泛的得到应用。尤其是 [BERT]火爆了之后。 Attention 到底有什么特别之处&#xff1f;他的原理和本质是什么&#xff1f;Attention都有哪些类型&#xff1f;本文将详细讲解Attention的方方面面。 Attention 的本质是什…...

实习记录——第十天

今天啥也不想说了&#xff0c;ctf里面还有道题目还没做&#xff0c;这里就不写了&#xff0c;把日报奉上&#xff0c;懂得都懂&#xff1a; 2.2日总结&#xff1a; 早上对xx银行的招聘网站做了渗透测试&#xff0c;对招聘网点赞处做重放看是否会多次点赞&#xff0c;对收藏处考…...

MySQL 隔离级别:脏读、幻读及不可重复读的原理与示例

一、MySQL 隔离级别 MySQL 提供了四种隔离级别,用于控制事务之间的并发访问以及数据的可见性,不同隔离级别对脏读、幻读、不可重复读这几种并发数据问题有着不同的处理方式,具体如下: 隔离级别脏读不可重复读幻读性能特点及锁机制读未提交(READ UNCOMMITTED)允许出现允许…...

YSYX学习记录(八)

C语言&#xff0c;练习0&#xff1a; 先创建一个文件夹&#xff0c;我用的是物理机&#xff1a; 安装build-essential 练习1&#xff1a; 我注释掉了 #include <stdio.h> 出现下面错误 在你的文本编辑器中打开ex1文件&#xff0c;随机修改或删除一部分&#xff0c;之后…...

屋顶变身“发电站” ,中天合创屋面分布式光伏发电项目顺利并网!

5月28日&#xff0c;中天合创屋面分布式光伏发电项目顺利并网发电&#xff0c;该项目位于内蒙古自治区鄂尔多斯市乌审旗&#xff0c;项目利用中天合创聚乙烯、聚丙烯仓库屋面作为场地建设光伏电站&#xff0c;总装机容量为9.96MWp。 项目投运后&#xff0c;每年可节约标煤3670…...

第25节 Node.js 断言测试

Node.js的assert模块主要用于编写程序的单元测试时使用&#xff0c;通过断言可以提早发现和排查出错误。 稳定性: 5 - 锁定 这个模块可用于应用的单元测试&#xff0c;通过 require(assert) 可以使用这个模块。 assert.fail(actual, expected, message, operator) 使用参数…...

Selenium常用函数介绍

目录 一&#xff0c;元素定位 1.1 cssSeector 1.2 xpath 二&#xff0c;操作测试对象 三&#xff0c;窗口 3.1 案例 3.2 窗口切换 3.3 窗口大小 3.4 屏幕截图 3.5 关闭窗口 四&#xff0c;弹窗 五&#xff0c;等待 六&#xff0c;导航 七&#xff0c;文件上传 …...

基于Springboot+Vue的办公管理系统

角色&#xff1a; 管理员、员工 技术&#xff1a; 后端: SpringBoot, Vue2, MySQL, Mybatis-Plus 前端: Vue2, Element-UI, Axios, Echarts, Vue-Router 核心功能&#xff1a; 该办公管理系统是一个综合性的企业内部管理平台&#xff0c;旨在提升企业运营效率和员工管理水…...

安卓基础(Java 和 Gradle 版本)

1. 设置项目的 JDK 版本 方法1&#xff1a;通过 Project Structure File → Project Structure... (或按 CtrlAltShiftS) 左侧选择 SDK Location 在 Gradle Settings 部分&#xff0c;设置 Gradle JDK 方法2&#xff1a;通过 Settings File → Settings... (或 CtrlAltS)…...

十九、【用户管理与权限 - 篇一】后端基础:用户列表与角色模型的初步构建

【用户管理与权限 - 篇一】后端基础:用户列表与角色模型的初步构建 前言准备工作第一部分:回顾 Django 内置的 `User` 模型第二部分:设计并创建 `Role` 和 `UserProfile` 模型第三部分:创建 Serializers第四部分:创建 ViewSets第五部分:注册 API 路由第六部分:后端初步测…...

[USACO23FEB] Bakery S

题目描述 Bessie 开了一家面包店! 在她的面包店里&#xff0c;Bessie 有一个烤箱&#xff0c;可以在 t C t_C tC​ 的时间内生产一块饼干或在 t M t_M tM​ 单位时间内生产一块松糕。 ( 1 ≤ t C , t M ≤ 10 9 ) (1 \le t_C,t_M \le 10^9) (1≤tC​,tM​≤109)。由于空间…...

GAN模式奔溃的探讨论文综述(一)

简介 简介:今天带来一篇关于GAN的,对于模式奔溃的一个探讨的一个问题,帮助大家更好的解决训练中遇到的一个难题。 论文题目:An in-depth review and analysis of mode collapse in GAN 期刊:Machine Learning 链接:...