three vue js
Vue为什么不推荐直接操作dom
Vue不推荐开发者直接操作dom（当然这并不表示不能这么做），有以下几个原因： 破坏了代码模块化结构导致代码腐化： 组件原本可以控制哪些dom操作可以对外暴露（即对应methods中的方法），但直接操作dom跳过了这个控制，这会导致不可预料的后果。 例如组件A中有一个输入框，且组件A没有暴露可以删除 ......
node.js的删除安装及vue-admin-template的下载
删除18 node版本过高(18了),这里需要16,因此将原来的node删除. 删除的方法是在设置中搜索node并找到,然后傻瓜式删除. 安装16 直接一路next确认就行 检查版本 vue-admin-template下载 这是一个版本为4.4.0的基础框架(官网:https://panjiach ......
2023.6.28 - vue项目打包内存堆栈溢出JS stacktrace
 vue项目打包时报错，JS stacktrace : Reached heap limit Allocation ......
js的事件循环
事件循环同步和异步任务分别进入不同的执行"场所"，同步的进入主线程，异步的进入Event Table并注册函数。当指定的事情完成时，Event Table会将这个函数移入Event Queue。主线程内的任务执行完毕为空，会去Event Queue读取对应的函数，进入主线程执行。上述过程会不断重复， ......
vue3+vite+js配置路径别名
1、让vscode认识@符号 项目下新建jsconfig.json,配置 baseUrl，paths 参数 { "compilerOptions": { "target": "esnext", "useDefineForClassFields": true, "module": "esnext", ......
JS中常用方法
# 数组 ## splice: splice() 方法的第一个参数是起始索引，第二个参数是要删除的元素数量（可以为0），然后可以传递更多的参数作为要插入的新元素。 ``` 限制删除的数量： const arr = [1, 2, 3, 4, 5]; const removed = arr.splice ......
js 浏览器全屏
只能手动触发 fullscreenact() { if (this.isFullScreen) { document.exitFullscreen(); } else { document.documentElement.requestFullscreen(); } this.isFullScree ......
VUE http大文件断点续传上传
对于大文件的处理，无论是用户端还是服务端，如果一次性进行读取发送、接收都是不可取，很容易导致内存问题。所以对于大文件上传，采用切块分段上传，从上传的效率来看，利用多线程并发上传能够达到最大效率。 本文是基于 springboot + vue 实现的文件上传，本文主要介绍服务端实现文件上传的步骤及 ......
vue中watch侦听器，deep和immediate的用法
1、deep深度监听的用法 当监听一个对象时，可能想监听整个对象的变化，而不仅仅是某个属性。但在默认情况下，如果你正在监听formData对象并且修改了formData.username，对应的侦听器并不会触发，它只在formData对象被整个替换时触发。 监听整个对象被称作深度监听，通过将deep ......
深入剖析：Vue核心之虚拟DOM
前言 使用 Vue 做项目也有两年时间了，对 Vue 的 api也用的比较得心应手了，虽然对 Vue 的一些实现原理也耳有所闻，例如 虚拟DOM、flow、数据驱动、路由原理等等，但是自己并没有特意去探究这些原理的基础以及 Vue 源码是如何利用这些原理进行框架实现的，所以利用空闲时间，进行 Vue ......
vue定时器
```js export default{ methods:{ fun1(){ const timer = setInterval(()=>{ //需要做的事情 },1000); //通过$once来监听定时器，在beforeDestroy钩子可以被清除。 this.$once('hook:befo ......
JS中字符串28种常用API总结，substring、slice、JSON.stringify、match、split、search、indexOf......
一、引言 在前端开发中，处理字符串是一项常见的任务。JavaScript 提供了一系列的字符串 API，用于操作和处理字符串数据。字符串常用的API方法有很多，包括查找字符串、截取字符串、替换字符串、分割字符串、大小写转换、字符串拼接和字符串比较等等。本文将介绍一些常用的字符串 API，并提供相应的 ......
vue input实现模糊搜索，input实现搜索下拉提示
html <input type="text" v-model="searchContent" style="border:1px solid red" @input="inputFun2"> <div v-for="(item,index) in optionsData" @click="getO ......
去往js函数式编程(8)完
## 冻结 如果我们希望避免程序员意外或故意修改对象的可能性，冻结对象是一个有效的解决方案。在对象被冻结之后，任何修改它的尝试都会静默失败。javascript 不会报告错误或抛出异常，但也不会修改对象。这种解决方案只有一个问题：冻结对象是一个浅层操作，它仅冻结属性本身，类似于 const 声明的作 ......
jsjiami.v6版本JS解密效果代码详解
JS加密和解密这两者的关系并不是单纯的矛和盾的关系，市面上很多的所谓完全不可逆JS加密是不怎么靠谱的说法，没有绝对的不可逆加密。当然也没有绝对的JS解密，在时间成本上来说JS加密比解密要快的多。 如果你需要对一个使用jsjiami.v6加密的JavaScript代码进行修改或解析，就需要进行解密操作 ......
JS中数组22种常用API总结，slice、splice、map、reduce、shift、filter、indexOf......
一、引言 在前端开发中，数组是一种常见且重要的数据结构。数组提供了许多便捷的方法来操作和处理其中的数据。本文将简单介绍前端中数组常用的API，包括添加、删除、截取、合并、转换等操作。 二、push() 方法和 pop() 方法 push()方法用于向数组末尾添加一个或多个元素，并返回修改后的数组的新 ......
vue3
# https://cn.vuejs.org/guide/introduction.html#what-is-vue # 简介 ``` import { createApp } from 'vue' createApp({ data() { return { count: 0 } } }).moun ......
js控制去掉iframe里面PDF文件的下载等功能
原代码： <iframe id="myIframe" src={`${src}`} style={{ width: '100%', height: '100vh' }}></iframe> 效果： 要去掉顶部的功能栏只要在src后面拼接一下'?page=hsn#toolbar=0' <iframe ......
js中getBoundingClientRect()方法详解
`getBoundingClientRect()`方法用于获取元素在浏览器视窗中的位置信息。该方法没有参数，调用方式为`element.getBoundingClientRect()`，其中`element`是要获取位置的DOM元素。 ......
前端Vue自定义手机号文本格式化组件手机号码文本转星号
#### 前端Vue自定义手机号文本格式化组件, 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id=13231 #### 效果图如下: 方法可以添加一个拖动条用来改变对象的某个属性，本节课给大家介绍.add()方法创建新的UI交互界面，比如下拉菜单、单选框。 .add()方法参数3和4数据类型 ......
前端Vue自定义银行卡号格式化组件 中间卡号文本转星号
#### 前端Vue自定义银行卡号格式化组件 中间卡号文本转星号, 下载完整代码请访问uni-app插件市场地址：https://ext.dcloud.net.cn/plugin?id=13230 #### 效果图如下:  npm install ......
vue3 vscode快捷模板
{ "Print to console": { "prefix": "v3", "body": [ "<script setup>", "import { ref, reactive, onBeforeMount, onMounted, onBeforeUpdate, onUpdated, onBe ......
Vue2.0针对设备调节显示内容方法
一晚上完成0.2.2、0.3.0、0.3.1三个版本的更新，很高兴，总结一下 项目地址： [穆音博客](https://blog.muvocal.com) 文章首发地址：[Vue针对设备调节显示](https://blog.muvocal.com/blog/11) ## Vue中进行优化的方式 总体 ......
vue脚手架引入less
安装依赖 npm i less@4.1.2,npm i less-loader@6.0.0 在页面使用加上lang='less' 和scope <style lang="less" scope> .el-menu-vertical-demo:not(.el-menu--collapse) { wid ......
vue组件-使用Vue.component全局注册组件
# 通过components注册的时`私有子组件` 例如： 在`组件A`的components节点下，注册了`组件F`。 则组件F只能用在组件A中；不能被用在`组件C`中。 # 注册`全局组件` 在vue项目的`main.js`入口文件中，通过`Vue.component()`方法，可以注册全局组件 ......
vue-组件-使用组件的三个步骤
# 组件之间的`父子关系`  # 使用组件的`三个步骤` ![image](https://img2023 ......
vue透传 Attributes
### Attributes 继承 在此之前，先来弥补一个小知识点，vue3支持多个根节点，vue2不支持， ``` ``` “透传 attribute”指的是传递给一个组件，却没有被该组件声明为 props 或 emits 的 attribute 或者 v-on 事件监听器。最常见的例子就是 c ......