写法vue2 vue js
【校招VIP】前端vue考点之生命周期和双向绑定
考点介绍： VUE是前端校招面试的重点，而生命周期和双向绑定又是基础考点之一，尤其在一二线公司，要求知道双向绑定的原理，以及相关代码实现。 一、考点题目 1、mvvm和mvc区别？它和其它框架（jquery）的区别是什么？哪些场景适合？ 解答：mvc和mvvm其实区别并不大。都是一种设计思想。主要就 ......
表格JS实现在线Excel的附件上传与下载
>摘要：本文由葡萄城技术团队于博客园原创并首发。转载请注明出处：[葡萄城官网](https://www.grapecity.com.cn/)，葡萄城为开发者提供专业的开发工具、解决方案和服务，赋能开发者。 # 前言 在本地使用Excel时，经常会有需要在Excel中添加一些附件文件的需求，例如在Ex ......
【技术积累】Vue.js中的CSS过渡【一】
博客推行版本更新，成果积累制度，已经写过的博客还会再次更新，不断地琢磨，高质量高数量都是要追求的，工匠精神是学习必不可少的精神。因此，大家有何建议欢迎在评论区踊跃发言，你们的支持是我最大的动力，你们敢投，我就敢肝 ......
vue3+vite+ts项目初始化
### 创建项目 ``` # npm 6.x npm create vite@latest my-vue-app --template vue # npm 7+, extra double-dash is needed: npm create vite@latest my-vue-app -- -- ......
[Vue warn]: Runtime directive used on component with non-element root node. The directives will not function as intended.
 ### 原因 意思是自定义指令不能放到组件上,而是要放到自有的元素上,也就是这里用到的`v-dialogDrag ......
JS实现播放音乐时歌词同步展示
效果如下： 实现过程： 监听音频播放时间，使用歌词的出现时间与其比较，展示对应时间歌词内容，代码如下 <audio id="audio-player" src="每个眼神都只身荒野.m4a" controls></audio> <div class="lyrics-container"> <div ......
next.js 源码解析 - getStaticProps、getStaticPaths 篇
> 😂 好久前写了关于 `getStaticProps` 和 `getStaticPaths` 的内容，然而半年过去了源码解析就一直忘记了，不久前有人提醒才想起来，补下坑。 本文主要是解读下 `getStaticProps`、`getStaticPaths` 相关的源码，不了解这两个 `API` ......
vue.js框架的iframe页面计时器无法销毁的解决方法
同学试过使用生命周期等方式都不能清除计时器；因而改用这个方法； 1,首先vue页面上随便写个有高度的div如下：用refs获取高度 <div class="hub-fixed-box" :style="{width:fixedWidth+'px' }" ref="fixedTop"></div> 2 ......
从无到有创建vue项目详细说明
一、vue需要安装的环境 1、Node.js : Javascript运行环境 推荐先安装nvm，然后在安装nodejs，可以切换不同版本的nodejs使用，请参考： nvm及nodejs安装和使用（Windows下切换多版本nodejs） npm ： 包管理工具（同Node.js一同安装） npm ......
vue页面对字段进行校验，必填未填则进行提示
<el-form :model="form"> <el-form-item label="等级名称" :label-width="formLabelWidth" prop="name" :rules="[{ required: true, message: '请输入等级名称', trigger: ' ......
Vue3 + Eslint + prettier
一、背景 公司内部团队大部分由多人组成，当遇到多个前端开发同一个项目时，代码规范及代码质量，是需要考虑的一个重中之重 二、Eslint + prettier 是什么 ESLint 的主要功能包含代码格式和代码质量的校验，而 Prettier 只是代码格式的校验，不会对代码质量进行校验。 代码格式问题 ......
PageOffice 6 最简集成代码(VUE+Springboot)
本文描述了PageOffice产品在（VUE+Springboot）前后端分离的项目中如何集成调用。调用PageOffice打开文件的主要核心代码是：后端Springboot项目中第6步和前端VUE项目中第6步的代码，其他代码都属于环境配置代码。 > 假设开发环境电脑IP为： > 192.168.1 ......
若依-Vue 单体版本 更换mybatisPlus
1、`单体模块在pom.xml ; 多模块版本在ruoyi-common\pom.xml、`模块添加整合依赖 ```xml com.baomidou mybatis-plus-boot-starter 3.4.1 ``` 2、`单模块在修改主题的application.yml ; 多模块在ruoyi ......
记录--vue3问题：如何实现微信扫码授权登录？
这里给大家分享我在网上总结出来的一些知识，希望对大家有所帮助 一、需求 微信扫码授权，如果允许授权，则登录成功，跳转到首页。 二、问题 1、微信扫码授权有几种实现方式？ 2、说一下这几种实现方式的原理是什么？ 3、vue中的微信扫码授权登录，与uniapp和原生小程序的微信授权登录，它们之间有共同点 ......
vue2使用富文本编辑器vue-quill-editor
一、将图片保存为base64编码（不建议） 使用步骤： 1、 安装vue-quill-editor npm install vue-quill-editor -S 2、main.js中全局引入 // 富文本编辑器 import VueQuillEditor from 'vue-quill-edito ......
JS逆向实战21——某查查webpack密码加密
# 声明 本文章中所有内容仅供学习交流，抓包内容、敏感网址、数据接口均已做脱敏处理，严禁用于商业用途和非法用途，否则由此产生的一切后果均与作者无关，若有侵权，请联系我立即删除！ # 网站 > aHR0cHM6Ly93d3cucWNjLmNvbS8= # 前言 阅读前 请先阅读下我的另一篇文章 看看别 ......
vue前端项目中遇到的问题以及解决方案-不定时更新
###vue-cli创建vue项目中全局使用mixin 首先需要安装插件 ~~~ npm install style-resources-loader vue-cli-plugin-style-resources-loader --save-dev ~~~ 修改vue.config.js文件 ~~~ ......
ChatGTP - 使用js实现升级游戏
实现一个完整且复杂的升级游戏涉及到很多方面，包括玩家操作、游戏状态管理、游戏规则和逻辑等等。下面是一个较为简化的升级游戏的代码示例： ```javascript // 游戏状态枚举 const GameState = { NOT_STARTED: 'NOT_STARTED', BETTING: 'B ......
ChatGTP - 使用js实现掼蛋游戏
实现一个完整而复杂的掼蛋游戏涉及到许多方面，包括玩家互动、游戏状态管理、游戏规则和逻辑等等。下面是一个较为简化的掼蛋游戏的代码示例： ```javascript // 定义一副扑克牌 const SUITS = ['♠', '♥', '♦', '♣']; const RANKS = ['2', '3 ......
ChatGTP - 使用js实现炸jinhua游戏
实现一个完整且复杂的炸jinhua游戏需要考虑到很多方面，包括玩家互动、游戏状态管理、游戏规则和逻辑等等。下面是一个较为简化的炸jinhua游戏的代码示例： ```javascript // 定义一副扑克牌 const SUITS = ['♠', '♥', '♦', '♣']; const RANK ......
若依单体Vue版本新增多环境配置
若依框架是一个简单的web后台管理脚手架，基于SpringBoot+Vue开发的。本次更改版本为3.8.7截止2023年8月14日，最新版本！ 若依自带只有 application.yml 与 application-druid.yml 两个配置文件。本次需要增加 dev 开发环境 ； prod 正 ......
js将多文件打包成zip下载
我们在项目中安装相关依赖 npm install jszip file-saver --save 创建一个js文件，并引入依赖 import JSZip from 'jszip' import FileSaver from 'file-saver' 开始调用 DownLoad () { this.M ......
vue3 中 props 传递响应式值不会变
vue3 中 通过 props 传递响应式值不会跟着响应式，原因为获取 props 的时候 直接通过 props.xxx 来获取了，如果要保持响应式，需要手动转为响应式 const { status } = toRefs(props) // or const status = toRef(props ......
Net7配置Autofac下IOC中的AOP，以及Autofac的三种生命周期写法
Net7配置Autofac下IOC中的AOP是分两种，一种是基于接口的，一种是基于实现类的 基于接口的好处是简单，但不能有效的控制具体到某个方法。也就是说，只能基于类来做操作，一个类下所有的方法都要接受注册 基于实现类的是稍微麻烦一点，生效方法必须改为 virtual ，但可以实现到具体某个方法的效 ......
spring mvc 前端返回 js
@RequestMapping(value = "/test",produces = "text/html; charset=UTF-8")@ResponseBodypublic String test(){String url = "";return "<script>window.locatio ......
详细讲解原生js拖拽
#### 场景描述 ``` 今天遇见一个问题，那就是产品希望在弹出来的窗口。 可以移动这个弹窗的位置 增加用户体验，我们直接使用的element-ui中的 Dialog 对话框 我们现在需要拖拽标题，移动元素位置 ``` #### 元素拖拽的思路 ``` 要让元素按下移动，我们需要实现以下几个步骤： ......
js 如何调用摄像头拍照
1.第一种 业务逻辑需要人脸验证，需要通过调用摄像头获取人脸来调用接口做对比，所以学习了一下js关于调用摄像头拍照。主要通过video调用摄像头和canvas截取画面。 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <m ......
vue图片放大缩小拖拽
1.封装可放大缩小拖拽组件<template> <div class="drag-outer" ref="dragWrap" :style="'width:'+imgWidth" @mouseenter="isHover = true" @mouseleave="isHover = isMoused ......
Vue+Element导出Excel表格示例
<template> <div @click="exportFn">导出</div> </template> <script> export default { data() { return { query: { pageIndex: 1, // 当前页 pageSize: 10, // 页大小 ......