编程开发 - 教程之家

317浏览

0评论

vue使用国密SM4进行加密、解密的过程

目录国密SM4算法优点：缺点：适用场景：示例代码：下面是vue具体实现Vue项目中引入sm4util并使用国密SM4算法国密SM4算法要在前端使用国密SM4进行加密和解密，可以使用asmCrypto库和国...

2023-07-25 20:24:42

315浏览

0评论

IntersectionObserver实现加载更多组件demo

实例import { useEffect, useRef } from 'react';import { Spin } from 'antd';import type { FsFC } from './types';import './index.less';type LoadMoreProps = { roo...

2023-07-25 20:24:41

198浏览

0评论

vue实现锚点跳转scrollIntoView()使用案例

目录vue实现锚点跳转：scrollIntoView()说明：使用案例：vue锚点跳转的三种方式（页内跳转，跨页跳转，函数跳转）1.需求2.跳转锚点的基本方式2.1 页面内通过点击来跳转2.2 从A页面跳转到B...

2023-07-25 20:24:36

168浏览

0评论

TypeScript为对象动态添加属性代码示例

目录1.定义2.TypeScript 类型模板3.为对象动态添加属性3.1 解决方法3.2 对象作为参数传递3.3 方法返回对象3.4 对象数组总结1.定义TypeScript 对象是包含一组键值对的实例。...

2023-07-25 20:24:34

215浏览

0评论

vue3+elementui-plus实现一个接口上传多个文件功能

首先，先使用element-plus写好上传组件，变量的定义我在这里就省略了都<el-form-item prop="file" label="附件"> <el-upload style="width:100%" class="u...

2023-07-25 20:24:31

286浏览

0评论

vue 导入js中的两种方法(示例详解)

目录1 方法一：使用标签2 方法二：使用 import 语句3 举例3.1 js文件3.2 vue 导入js文件4 举例4.1 js文件4.2 vue 导入js文件 -->XXX 是一个自定义的变量名5 修改文件后一定要...

2023-07-25 20:24:27

330浏览

0评论

react中使用better-scroll滚动插件的实现示例

在react中使用better-scroll滚动插件最近公司使用react项目中有一些滚动的效果需要有一些插件来支持，比如iScroll，或者react-scroll，最后还是选择了better-scroll文档比较友好...

2023-07-25 20:24:24

431浏览

0评论

使用html2canvas截图不全问题的解决办法

目录实现方法遇见问题具体封装代码总结实现方法利用 html2canvas 工具将html转为图片流 npm install html2canvas
利用 jspdf 工具将图片流转为 pdf 并保存...

2023-07-25 20:24:21

541浏览

0评论

Element ui tree(树)实现父节点选中时子节点不选中父节点取消时子节点自动取消功能

Elementui因为vue在国内的影响而受益使用量巨大树作为一种重要的开发组件应用广泛，今天带大家了解树的灵活应用首先我们来创建一个树 <el-tree :data="data"...

2023-07-25 20:24:17

181浏览

0评论

React中的useEffect四种用法分享

目录什么是 useEffect ?1 ： useEffect 中触发更新2 ：用法2 重复的 useEffect3 ：依赖值触发回调4 ：useEffect 的返回值结束啦什么是 useEffect ?官方解释： useEffect 是一个 Re...

2023-07-25 20:24:10

185浏览

0评论

react16.8.0以上MobX在hook中的使用方法详解

目录引言一般用法修饰方法优化,分离,传值2021.3.11 更新引言关于 mobX 在 react 16.8.0 以上的用法以下例子均取自官网文档一般用法import { observer, useLocalStore } f...

2023-07-25 20:24:02

457浏览

0评论

Vue3中是如何实现数据响应式示例详解

目录副作用函数响应式数据副作用函数指的是会产生副作用的函数；JavaScriptlet val = 1;//全局变量function effect() { val = 2; //修改全局变量，产生副作用}当effect函数执...

2023-07-25 20:23:59

217浏览

0评论

vite中的glob-import批量导入的实现

在 Vite 中，批量导入文件的最佳实践是使用 glob导入特性。这个特性可以在一行代码中导入多个文件，而不需要为每个文件编写独立的导入语句。一般的使用场景是，当文件过多或者需...

2023-07-25 20:23:55

338浏览

0评论

Vue2模版编译流程详解

目录1、起步项目结构App.vuewebpack.config.js打包构建vue-loader 源码template-loader2、模板编译流程parseHTML 阶段genElement 阶段compilerToFunction 阶段parseHTML 阶...

2023-07-25 20:23:53

273浏览

0评论

解决vue3报错:找不到模块或其相应的类型声明

目录问题截图解决方法：总结问题截图解决方法：在项目根目录或 src 文件夹下找到env.d.ts，并写入以下内容:// env.d.ts/// <reference types="vite/client" /> // 简单版本// dec...

2023-07-25 20:23:44

277浏览

0评论

javascript适配器模式和组合模式原理与实现方法详解

一、适配器模式1、作用：主要解决两个软件实体间接口不兼容的问题2、实例（1）地图渲染的适配//谷歌和百度地图的渲染地图调用的方式不一样 var googleMap = {...

2023-07-25 20:23:38

568浏览

0评论

解决Vue2 axios发请求报400错误"Error: Request failed with status code 400"

目录请求：错误：解决方案：总结最近在做一个项目，后端写了一个登录接口，postman可以正常请求。但我axios发请求出现400错误"Error: Request failed with status code 400"请求： te...

2023-07-25 20:23:32

470浏览

0评论

JavaScript 如何删除小数点后的数字

使用 Math.trunc() 函数删除小数点后的数字，例如 Math.trunc(1.37)。 Math.trunc() 函数删除小数位并返回数字的整数部分。const num = 124.567;const removeDecimal = Math....

2023-07-25 20:23:26

313浏览

0评论

hash和history路由模式区别示例解析

目录单页应用hash模式hashChange()history模式hash模式和history模式的区别单页应用目前单页应用（SPA）越来越成为前端主流，单页应用一大特点就是使用前端路由，由前端来直接控制...

2023-07-25 20:23:24

333浏览

0评论

elementUI中input回车触发页面刷新问题与解决方法

目录前言解决方法：element也给出了解决方法注意事项：总结前言今天在做项目的的时候发现创建的el-form表单内单个el-input框输入值后点回车会导致页面刷新的问题，于是好奇心驱...

2023-07-25 20:23:21

369浏览

0评论

JS中数组合并的几种常见方法

JS 中有多种方法可以将多个数组合并成一个数组。1、使用 Array.prototype.concat() 合并：concat() 方法可以将多个数组合并成一个新数组。let arr1 = [1, 2, 3];let arr2 = [...

2023-07-25 20:23:17

412浏览

0评论

详解Vue3子组件向父组件传递消息

目录父子组件之间的通信：props与emit常规使用子组件向父组件传递消息与emit的区别：定义和调用的不同父子组件之间的通信：props与emit通常提到props，都会想到的是父组件给子组件...

2023-07-25 20:23:15

416浏览

0评论

JS 将字符串中指定字符全局替换的方法

目录JS 将字符串中指定字符全局替换语法Js中对字符串中的字符进行替换一，主要是运用replace方法进行字符的替换二、利用for循环和replace实现字符串中字符某个字符全部替换JS...

2023-07-25 20:23:08

440浏览

0评论

Element-ui设置el-table表头全选框隐藏或禁用

目录需求：方法1：方法2：方法3：总结需求：设置el-table表头的多选框隐藏或禁用，网上找的均造成即时生效，但刷新页面时页面会卡顿。方法1：直接使用css（scoped中）设置：::v-deep .el-table__h...

2023-07-25 20:23:05

180浏览

0评论

vue3+el-select实现触底加载更多功能(ts版)

目录思路main.tshome.vue思路使用全局指令来实现触底加载功能通过el-select中的popper-class给下拉框加入一个类名在src下的utils文件夹中创建selectLoadMoreDirective.ts文...

2023-07-25 20:23:01

490浏览

0评论

window.location.href和window.open窗口跳转区别解析

目录一、直接跳转式二、开新窗口跳转例子参数解释window.open打开新窗口还是打开新标签页一、直接跳转式window.location.href='https://www.baidu.com'二、开新窗口跳转win...

2023-07-25 20:22:59

292浏览

0评论

vue实现多个el-form表单提交统一校验的2个方法

目录1. 定义模板内容2. 方法一3. 方法二总结通过以下两种方法实现多个表单的统一校验：1. 定义模板内容在 el-form 表单中添加 ref 属性来获取表单组件对象<template> <div>...

2023-07-25 20:22:56

294浏览

0评论

vue3使用base64加密的两种方法举例

目录插件--js-base64文件形式总结Hi,今天分享一个在vue中使用base64对用户名、密码进行加密的小案例。我们是可以有两种方法的：1.使用插件:js-base642.引入文件。插件--js-ba...

2023-07-25 20:22:53

185浏览

0评论

Vue3实现动态面包屑的代码示例

目录前言面包屑的介绍和实现思路✍️✍️获取路由数据⚡️⚡️对route.matched的理解开始完成动态面包屑...

2023-07-25 20:22:50

210浏览

0评论

JS实现数组内值累加常见的3个方法

目录一、方法一：（使用for循环）二、方法二：（使用reduce方法）三、方法三：（使用forEach方法）附:js实现对象数组去重及数据叠加总结怎么实现数组的每一个值进行累加呢？我只想到了三种方法，...

2023-07-25 20:22:43

323浏览

0评论

vue数组中不满足条件跳出循环问题

目录vue数组中不满足条件跳出循环场景分析解决方式实现vue数组循环遍历中途跳出整个循环总结vue数组中不满足条件跳出循环场景在表格中选中的数据在右边显示，在点击确定按钮...

2023-07-25 20:22:40

520浏览

0评论

Vue报错:Injection "xxxx" not found的解决办法

目录1.产生原因2.解决办法总结1.产生原因子组件或者孙组件在父组件 provide 提供的依赖注入时，子组件或孙组件是在不同页面引入的，有的页面使用 provide 提供了依赖，有的没有提...

2023-07-25 20:22:33

168浏览

0评论

Vue判断数组内是否存在某一项的两种方法

目录Vue判断数组内是否存在某一项两种方法：findIndex（）和 indexOf（）方法VUE-判断数组中是否含有某个值①findIndex（）②find（）③indexOf（）④filter（）⑤includes（）Vue判断数组内是否存在某一...

2023-07-25 20:22:29

300浏览

0评论

JS实现深拷贝的4种方式介绍

目录概念1、递归方式（推荐，项目中最安全最常用）2、JSON.stringify() ；(这个不推荐使用，有坑)3、使用第三方库lodash中的cloneDeep()方法4、jquery的extend()方法进行深拷贝（推荐在...

2023-07-25 20:22:26

460浏览

0评论

Vue3 中实现元素拖拽功能

目录进入正题准备实验环境元素的位置和移动定义三组坐标注册 mousedown 事件实现拖拽的核心补充其它部分代码和演示总结进入正题元素拖拽是一个比较典型的前端学习案例，需要...

2023-07-25 20:22:24

159浏览

0评论

React在Dva项目中创建并引用页面局部组件的方式

这篇文章我们演示Dva中编写组件的方式官方这里也特意强调了UI这个关键词跟多是作为我们界面元素的组件而不是页面路由我们要单独做路由的组件肯定还是直接放在我们Dva项目...

2023-07-25 20:22:18

313浏览

0评论

javascript模板方法模式和职责链模式实例分析

一、模板方法模式1、模板方法模式，基于继承的设计模式，由两部分组成，抽象父类和具体实现子类。2、例子Coffe 和 Tea//创建抽象类 -- 饮料 function Beverage(){} Bever...

2023-07-25 20:22:13

299浏览

0评论

React Native与iOS OC之间的交互示例详解

目录前置准备RN 传值给 iOS方法 1 正常传值给原生方法 2 传递回调函数方法 3 获取 promise 回调方法 3 获取 promise 的同步方式iOS 传值给 RN 端初始的数据提供添加监听事...

2023-07-25 20:22:09

302浏览

0评论

react实现记录拖动排序

最近项目中要做一个拖动排序功能，首先想到的是之前项目中用过的antd自带的tree和table的拖动排序，但是只能在对应的组建里使用。这里用的是自定义组件，随意拖动排序，所以记录一...

2023-07-25 20:22:05

462浏览

0评论

vue3集成Element-Plus之全局导入和按需导入

目录element-plus集成1. 全局引入2. 局部引入（按需引入）2.1 手动引入1.安装插件：2.配置vue.config.js2.3 自动导入组件以及样式[推荐】1.安装插件：2.配置vue.config.js（其他配置...

2023-07-25 20:22:02

442浏览

0评论

vue3锚点定位两种实现方式示例

目录方法1：利用ref实现锚点定位前面的废话文学解决问题的方法1. setup函数内定义变量2. 动态获取ref并存放到eleRefs数组当中3. 滚动到特定的ref位置方法2: 利用a标签实现...

2023-07-25 20:21:59

171浏览

0评论

JS算法题解旋转数组方法示例

目录题目示例 1:示例 2:答案解法1：解法2：解法3：解法4：题目给定一个数组，将数组中的元素向右移动 k 个位置，其中 k 是非负数。示例 1:输入: [1,2,3,4,5,6,7] 和 k = 3 输出: [5,6,7...

2023-07-25 20:21:57

189浏览

0评论

js判断两个数组是否存在相同元素的四种方法

目录1.第一种方法-简单2.第二种方法-双重循环3.第三种方法-利用set和some4.第四种方法-set交集总结1.第一种方法-简单思路很简单：两个数组遍历判断。function hasRepeat(arr1...

2023-07-25 20:21:54

351浏览

0评论

在vue3项目中实现国际化的代码示例

目录首先我们进行一下最终效果的展示：了解国际化的实现思路⚽️⚽️在项目开发中使用国际化⛹️&zwj;♀️⛹️&zwj;♀️初始化配置在项目中使用element-plus组件中的国际化处理...

2023-07-25 20:21:49

310浏览

0评论

vue .then和链式调用操作方法

Vue.then一、Vue.then是什么意思Vue.then是Vue.js框架中对于异步操作进行处理的一个方法。它与Promise结合使用，相当于Promise中的then方法，可以处理异步操作的结果，从而实现对...

2023-07-25 20:21:42

182浏览

0评论

vue项目打包开启gzip压缩具体使用方法

目录使用前使用后方法基本原理具体使用1.安装插件2.配置插件3.nginx配置使用前使用后方法webpack配置Compression-webpack-plugin压缩gzip文件作用：提升网络传输率->优化web...

2023-07-25 20:21:37

448浏览

0评论

js中net::ERR_FILE_NOT_FOUND报错的解决

net::ERR_FILE_NOT_FOUND的意思是：网：错误_文件_没有找到，也就是说绑定数据源文件有问题。这时要检查是否是拼写错误、路径错误，或者是逻辑问题。我的控制台报错如下：我的页面显...

2023-07-25 20:21:32

178浏览

0评论

JavaScript反转数组常用的4种方法

目录1.使用For循环反转数组：2.使用Unshift()方法反转数组：3.就地反转阵列：（改变原数组）4.直接调用 reverse()：总结1.使用For循环反转数组：我们将为这种方法使用递减循环，以迭代给定...

2023-07-25 20:21:25

176浏览

0评论

element中drawer模板的实现

目录1、效果图2、上代码1、效果图2、上代码<template> <div> <el-drawer size="100%" :visible.sync="drawer" style="positio...

2023-07-25 20:21:21

289浏览

0评论

antd table动态修改表格高度的实现

antd中,flex布局不生效,得计算表格高度并且去赋值从而动态 <div class="table1" v-loading="loading" v-show="showTable"> <a-table :...

2023-07-25 20:21:17

热门文章