input滑块突然拉满的问题 问题开发中有一个这样的布局<div class="set-slider-container"> <div class="icon-wrapper" @click="handleMinus('rapid-release')"> <svg width="40" height="40" viewBox="0 0 40 40"> <circle cx="20" cy="20" r="20" fill="#cccccc"/> <line x1="10" y1="20" x2="30" y2="20" stroke="#444444" stroke-width="6" stroke-linecap="round"/> </svg> </div> <input type="range" :min="10" :step="10" :max="config.maxLimit" v-model="axisVo.rapidRelease"> <div class="icon-wrapper" @click="handleIncrease('rapid-release')"> <svg width="40" height="40" viewBox="0 0 40 40"> <circle cx="20" cy="20" r="20" fill="#cccccc"/> <line x1="10" y1="20" x2="30" y2="20" stroke="#444444" stroke-width="6" stroke-linecap="round"/> <line x1="20" y1="10" x2="20" y2="30" stroke="#444444" stroke-width="6" stroke-linecap="round"/> </svg> </div> <div>{{ (axisVo.rapidRelease * 0.001).toFixed(2) }} mm</div> </div>原因因为 v-model="axisVo.rapidRelease" 绑定导致数据类型问题 改为v-model.number="axisVo.rapidRelease" 即可。详细情况待补充

CSS之MP4背景动态缩放 需求项目上要求用一个视频做背景， 给到的文件是一个4k的若干秒视频，webui设计图1080p, 且没有提供个其他分辨率资料， 故根据屏幕分辨率动态缩放<template> <div class="index-root"> <div class="index-video-bg"> <video autoplay muted loop :style="getVideoScale()"> <source src="@/assets/video/bg_4k.mp4" type="video/mp4"> 您的浏览器不支持视频标签。 </video> </div> </div> </template>.index-root { display: flex; flex-direction: column; position: relative; overflow: hidden; height: 100vh; width: 100vw; justify-content: center; .index-video-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 0; video { min-width: 100%; min-height: 100%; width: auto; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); object-fit: cover; } } }computed: { getVideoScale() { return () => { if (this.videoScale && this.videoScale > 0) { return 'transform: translate(-50%, -50%) scale(' + this.videoScale + ');'; } return ''; }; }, }, mounted() { const screenWidth = window.screen.width; const screenHeight = window.screen.height; let number1 = screenWidth / 3840; let number2 = screenHeight / 2156; if (number1 < 1.0 || number2 < 1.0) { this.videoScale = Math.max(number1, number2); } },大致流程便是如此， 实际使用还需要完善一些其他逻辑！！！