前端 终端 实战vue
前端图片最优化压缩方案
function compressImg(file, quality) { var qualitys = 0.52 if (parseInt((file.size / 1024).toFixed(2)) < 1024) { qualitys = 0.85 } if (5 * 1024 < parse ......
基于vue脚手架的练习2
<template> <div> <span>父值为:</span>{{ to_value }} <button @click="clear()">清空</button> </div> </template> <script> export default { props:['to_value'], ......
Vue路由params、query传参用法，以及form表单回车自动提交问题
一、路由参数用法 1.1 query参数 第一种方式传参：跳转路由并携带query参数，注意to的字符串写法 将id和title拼接字符串形成地址 <router-link :to="`/home/message/detail?id=${item.id}&title=${item.title}`"> ......
vue实现下载附件功能
两种方式下载： 第一种：直接a标签下载 <a class="item-btn download" :href="'/xxx/xxx/download?id=' + xxx.id" :download="xxx.name">下载附件</a> 第二种： <el-button class="item-bt ......
ACPM高效C++组件管理让音视频终端SDK性能更好、稳定性更高
本专栏将分享阿里云视频云MediaBox系列技术文章，深度剖析音视频开发利器的技术架构、技术性能、开发能效和最佳实践，一起开启音视频的开发之旅。本文为MediaBox技术架构篇，重点从 ACPM介绍、技术架构以及高效管理等方面，介绍如何通过MediaBox ACPM的高效组件管理，来提升音视频终端S ......
vue-quill富文本编辑器实现图片缩放
安装环境 官网：https://vueup.github.io/vue-quill/guide/modules.html npm安装：npm install @vueup/vue-quill@latest --save pnpm安装：pnpm add @vueup/vue-quill@latest ......
Windows服务器，通过Nginx部署VUE+Django前后端分离项目
目录 基本说明 安装 Nginx 部署 VUE 前端 部署 Django 后端 Django admin 静态文件（CSS，JS等）丢失的问题 1. 基本说明 本文介绍了在 windows 服务器下，通过 Nginx 部署 VUE + Django 前后端分离项目。本项目前端运行在 80 端口，服务 ......
vue中this.$refs的使用方法和遇到的问题
this.$refs ：用于操作真实的DOM节点。 在开发时碰到了一个小需求，需要子组件向父组件传参，而且是不需要通过事件传递的，一开始使用this.$emit()来写的，但是一直没有接受到参数，于是放弃了使用this.$emit()的使用。 于是，使用了在父组件中调用子组件的方法，来获取传递的参数 ......
JavaWeb - Day03 - Ajax、前端工程化、Element
01. Ajax-介绍 Ajax 概念：Asynchronous JavaScript And XML，异步的JavaScript和XML。 作用： 数据交换：通过Ajax可以给服务器发送请求，并获取服务器响应的数据。 异步交互：可以在不重新加载整个页面的情况下，与服务器交换数据并更新部分网页的技术 ......
小程序开发实战案例之三 | 小程序底部导航栏如何设置
小程序中最常见的功能就是底部导航栏了，今天就来看一下怎么设置一个好看的导航栏～这里我们使用的是支付宝官方小程序 IDE 做示范。 ......
前端记录
vite 分包 build: { outDir: 'dist', assetsDir: 'assets', rollupOptions: { output: { manualChunks: (id) => { if (id.includes('node_modules')) { //D:/proje ......
VS Code 配置Vue3模板
配置用户代码片段 搜索vue 配置模板 { "vue3": { "prefix": "vue3", "body": [ "<template>", " <div>", " </div>", "</template>", "", "<script setup lang=\"ts\">", "impor ......
OpenTiny Vue 3.12.0 发布：文档大优化！增加水印和二维码两个新组件
TinyVue 3.12.0 主要更新：全面优化 54 个高频组件的 Demo / API 文档，让文档更加清晰易懂、符合预期；Watermark 水印组件；QrCode 二维码组件。 ......
盘点一个Pandas处理Excel表格实战问题（上篇）
大家好，我是皮皮。 一、前言 前几天在Python最强王者交流群【哎呦喂 是豆子～】问了一个Pandas实战的问题，一起来看看吧。问题描述： 大佬们~ 请问下这个数据怎么实现呢？有2组数据：第一个数据《获取的数据.xlsx》:每13行数据为一组，要实现一列数据拆分成多列数据（这边简称表1），见截图 ......
前端学习-JavaScript学习-js基础-API02
学习视频:黑马程序员视频链接 事件监听 三要素：事件源、事件类型、事件处理程序 随机点名案例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=dev ......
[Vue] vue学习笔记(8): 生命周期(vue2)
vue里的生命周期，也叫生命周期回调函数，是指vue在一些关键时刻引用的特定函数，这些函数的名称是确定的，这些函数中的this指向vue实例或组件实例 挂载流程 0️⃣初始化生命周期和事件，但数据代理还未开始 1️⃣beforeCreate() ➡️ 此时无法通过vue实例访问data中的数据以及m ......
vue解析上传的json文件信息
1.模版 <a-upload name="layoutFile" v-model:file-list="fileList" @change="importModules" accept="*" :showUploadList="false" :customRequest="() => {}" :he ......
Vue2 的@hook 、 hook: 与生命周期
如何实现父组件监听子组件的生命周期 方法一：$emit // 父组件 <template> <div> <Child @mounted="onMounted" @updated="onUpdated" @beforeDestroy="onBeforeDestroy" ></Child> </div> ......
【Nginx/IIS】解决uniapp/Vue history模式下页面刷新404
uniapp/Vue 开启History模式 本地开发：二级页面刷新或者通过链接进入二级页面是正常的 打包部署后：二级页面刷新或者通过链接进入二级页面会报错404页面找不到 解决方案： Nginx配置： 在nginx.conf的对应location里配置一行代码 try_files $uri $ur ......
单元测试实战（二）Service 的测试
单元测试实战（二）Service 的测试 为鼓励单元测试，特分门别类示例各种组件的测试代码并进行解说，供开发人员参考。 本文中的测试均基于JUnit5。 单元测试实战（一）Controller 的测试 单元测试实战（二）Service 的测试 单元测试实战（三）JPA 的测试 单元测试实战（四）My ......
如何使用Visual Studio 2022创建基本Vue.js.Web应用程序
最近接了个物联网项目，需要用到 VUE Ant-Design 对于 vue 没有概念 只能查找相关 vue.js 的知识。 了解vue.js 的 前提条件 是要对 HTML +CSS +Jscript 有一定的知识储备。 所以 又去看了看 对应的三剑客（HTML +CSS +Jscript）。 跟着 ......
vue3视频播放器组件vue-video-player
1、安装 npm i vue3-video-play --save 2、全局注册 import vue3videoPlay from 'vue3-video-play' // 引入组件 import 'vue3-video-play/dist/style.css' // 引入css app.use( ......
基于vue2开发的html5页面实现微信分享卡片（微信好友+朋友圈+qq好友+qq空间）
首先附上文档链接： 1.微信官方文档：https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#111 2.免费生成二维码的草料官网：https://cli.im/text/other 需求： 在浏览器分享链接时 ......
vue中孙子调用爷爷组件的方法怎么调用?
使用Vue的provide和inject来实现跨层级的组件通信。 provide允许一个祖先组件（爷爷组件）提供数据， 而inject允许子孙组件（孙子组件）在任意层级注入这个数据。 通过这种方式，你可以在孙子组件中访问到爷爷组件提供的方法。 以下是一个简单的例子： // 在爷爷组件中提供方法 ex ......
海上液化天然气 LNG 终端 | 图扑数字孪生
为了让用户更便捷地管理液化天然气 (LNG) 接收站，图扑软件应用自研 HT for Web 产品，数字孪生轻量化 LNG 接收站三维可视化监控平台。形象还原出 LNG 站全貌、实时转运、储存和再气化过程，协助运维人员进行高效数据分析、智能决策和远程操作，助力 LNG 接收站得以精益化管理。 ......
快速认识，前端必学编程语言：JavaScript
JavaScript是构建Web应用必学的一门编程语言，也是最受开发者欢迎的热门语言之一。所以，如果您还不知道JavaScript的用处、特点的话，赶紧补充一下这块基础知识。 JavaScript 是一种高级、单线程、垃圾收集、解释或即时编译、基于原型、多范式、动态语言，具有非阻塞事件循环，因构建网 ......
a-table(AntDesign Vue)实现表格行上下拖动排序
参考链接： https://blog.csdn.net/song_de/article/details/125218350 https://blog.csdn.net/m0_61342618/article/details/132556739?utm_medium=distribute.pc_rel ......
vue中this.$set()的使用
data中数据，都是响应式。也就是说，如果操作data中的数据，视图会实时更新； 但在实际开发中，遇到过一个坑：若data中数据类型较为复杂，方法methods中改变对象的属性，而页面并不会改变 原因是vue监听不到数据类型特别复杂的属性。 可以使用this.$set()来进行强制更新，进而解决问题 ......
vue webpack 配置babel es6转化转化es5
1、安装相关依赖 npm i -D @babel/core@7.12.3 npm i -D @babel/preset-env@7.12.1 npm i -D babel-loader@8.0.6 // 语法中有 async await 等 npm i -D @babel/plugin-transf ......