Ver código fonte

输入框问题

黄琪勇 1 ano atrás
pai
commit
d499b21866

+ 7 - 3
src/components/Metronome/Metronome.vue

@@ -48,7 +48,6 @@
               :value="speedNum"
               :show-button="false"
               @update:value="(num:number)=>{
-                console.log(num)
                 if(num){
                   if(num<=50){
                     speedNum=50
@@ -244,6 +243,11 @@ const { volumeNum, playState, speedNum, startPlay, pausePlay } = useMetronome(
 );
 
 onMounted(() => {
+  /*  n-input-number 有bug  input-props设置maxlength不上去 */
+  const iptDoms = document.querySelector(
+    '.Metronome .MetronomeBox .optMid .n-input__input-el'
+  );
+  iptDoms?.setAttribute('maxlength', '3');
   getCircleBar(speedToScalc(speedNum.value));
 });
 watch(speedNum, () => {
@@ -513,9 +517,9 @@ defineExpose({
             }
             .n-input__input-el {
               text-align: center;
-              font-family: DINAlternate, DINAlternate !important;
+              font-family: DINA !important;
               font-weight: bold !important;
-              font-size: 40Px !important;
+              font-size: 45Px !important;
               color: #000000 !important;
             }
           }

+ 11 - 7
src/components/timerMeter/TimerMeter.vue

@@ -23,9 +23,6 @@
               :format="(value: number | null)=>{
                 return value?(value<10?`0${value}`:value+''):'00'
               }"
-              :input-props="{
-                maxLength: '2'
-              }"
               @update:value="(num:number)=>{
                 if(num){
                   if(num<0){
@@ -75,9 +72,6 @@
               :format="(value: number | null)=>{
                 return value?(value<10?`0${value}`:value+''):'00'
               }"
-              :input-props="{
-                maxLength: '2'
-              }"
               @update:value="(num:number)=>{
                 if(num){
                   if(num<0){
@@ -156,12 +150,22 @@
 </template>
 
 <script setup lang="ts">
-import { ref, watch, onUnmounted } from 'vue';
+import { ref, watch, onUnmounted, onMounted } from 'vue';
 import { NInputNumber } from 'naive-ui';
 import soundWav from './timer.wav';
 import Dragbom from '@/hooks/useDrag/dragbom';
 
 const soundVIdeo = new Audio(soundWav);
+
+onMounted(() => {
+  /*  n-input-number 有bug  input-props设置maxlength不上去 */
+  const iptDoms = document.querySelectorAll(
+    '.timerMeter .timeInput .timeInputBox .n-input__input-el'
+  );
+  iptDoms.forEach(item => {
+    item.setAttribute('maxlength', '2');
+  });
+});
 onUnmounted(() => {
   clearInterval(_time);
   soundVIdeo.pause();