当前位置: 首页 > 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;对收藏处考…...

Tessent测试流程文件里的Tcl魔法:用if/else让你的扫描测试配置更灵活

Tessent测试流程文件里的Tcl魔法&#xff1a;用if/else让你的扫描测试配置更灵活 在芯片测试领域&#xff0c;Tessent Shell作为业界领先的测试解决方案&#xff0c;其Test Procedure File&#xff08;测试流程文件&#xff09;的灵活运用往往能决定测试效率的高低。今天我们要…...

Windows Subsystem for Android全流程实战攻略:从环境搭建到场景落地

Windows Subsystem for Android全流程实战攻略&#xff1a;从环境搭建到场景落地 【免费下载链接】WSA Developer-related issues and feature requests for Windows Subsystem for Android 项目地址: https://gitcode.com/gh_mirrors/ws/WSA Windows Subsystem for And…...

为什么头部自动驾驶团队已在预研C++27反射?——静态反射在嵌入式ABI稳定、安全认证代码生成中的不可替代性揭秘

第一章&#xff1a;C27静态反射的演进脉络与战略定位C27静态反射并非凭空而生&#xff0c;而是ISO C标准化进程中长达十年深度探索的结晶。它继承并重构了C17的std::is_same、C20的std::source_location与反射TS&#xff08;P0194R8&#xff09;的语义骨架&#xff0c;同时彻底…...

Joplin进阶玩法:用5块钱/月的NAS实现企业级笔记同步(群晖DSM7+Cpolar实战)

Joplin进阶玩法&#xff1a;用5块钱/月的NAS实现企业级笔记同步&#xff08;群晖DSM7Cpolar实战&#xff09; 在信息爆炸的时代&#xff0c;个人知识管理已成为现代职场人的核心竞争力。传统云笔记服务如Evernote、Notion虽然功能丰富&#xff0c;但高昂的订阅费用&#xff08;…...

别再手动对齐时序了!SystemVerilog Clocking Block实战:从接口封装到UVM验证的保姆级避坑指南

SystemVerilog Clocking Block深度实战&#xff1a;告别时序混乱的验证艺术 在数字验证的世界里&#xff0c;时序问题就像潜伏在代码中的幽灵&#xff0c;总是在最意想不到的时刻制造麻烦。想象一下这样的场景&#xff1a;你的测试用例逻辑完美无缺&#xff0c;却在信号采样时遭…...

【AI智能体】Claude Code 核心记忆文件 CLAUDE.md实战操作详解

目录 一、前言 二、Claude Code 介绍 2.1 Claude Code 是什么 2.2 Claude Code 核心特点 2.3 与其他AI编程工具对比 三、CLAUDE.md 项目记忆文件介绍 3.1 CLAUDE.md 文件概述 3.1.1 CLAUDE.md 是什么&#xff1f; 3.1.2 CLAUDE.md 核心特点 3.1.3 CLAUDE.md 核心价值 …...

裸金属STM32H7+FreeRTOS环境下C++异常处理编译开销超预期?独家逆向分析.bss段暴涨根源(含汇编级对比报告)

第一章&#xff1a;裸金属STM32H7FreeRTOS环境下C异常处理的编译开销悖论在裸金属 STM32H7 平台上启用 C 异常&#xff08;-fexceptions&#xff09;看似能提升错误可维护性&#xff0c;但其与 FreeRTOS 实时内核及 Cortex-M7 架构的交互却引发显著的编译与运行时开销悖论&…...

实战指南:基于快马平台生成trea国际版本地化价格展示组件代码

最近在开发一个国际电商项目时&#xff0c;遇到了一个很实际的需求&#xff1a;需要根据不同地区用户展示本地化格式的商品价格。这个看似简单的功能&#xff0c;其实涉及到货币转换、数字格式化、符号位置等多个细节。经过一番摸索&#xff0c;我总结出了一套比较完整的实现方…...

Makefile 入门与 C/C++ 项目构建指南

Makefile 入门与 C/C 项目构建指南 本文面向 C/C 初学者与日常维护多文件工程的开发者&#xff0c;系统说明 GNU Make 与 Makefile 的作用、执行逻辑、常用语法与可复用模板&#xff0c;帮助从「手动敲 gcc」过渡到可维护的自动化构建&#xff0c;并具备阅读、修改常见开源项目…...

终极PT资源管理工具:auto_feed_js实现100+站点一键转载的高效解决方案

终极PT资源管理工具&#xff1a;auto_feed_js实现100站点一键转载的高效解决方案 【免费下载链接】auto_feed_js PT站一键转载脚本 项目地址: https://gitcode.com/gh_mirrors/au/auto_feed_js 在PT资源分享的世界里&#xff0c;每一位爱好者都曾面临过重复填写资源信息…...