瀏覽代碼

[edit][bug]

zhangwei 3 年之前
父節點
當前提交
788158cfab
共有 1 個文件被更改,包括 15 次插入8 次删除
  1. 15 8
      src/view/components/font-amount.vue

+ 15 - 8
src/view/components/font-amount.vue

@@ -2,10 +2,13 @@
     <span :style="{ fontSize: amount_font_size + 'px' }">{{ amount }}</span>
     <span :style="{ fontSize: amount_font_size + 'px' }">{{ amount }}</span>
 </template>
 </template>
 <script setup>
 <script setup>
-import { ref, defineProps, onMounted } from 'vue'
+import { ref, defineProps, onMounted, watch } from 'vue'
 
 
 let props = defineProps({
 let props = defineProps({
-    amount: String,
+    amount: {
+        type: String,
+        default: ''
+    },
     width: {
     width: {
         type: Number,
         type: Number,
         default: 360
         default: 360
@@ -14,21 +17,25 @@ let props = defineProps({
         type: Number,
         type: Number,
         default: 56
         default: 56
     },
     },
-    
+
 })
 })
 
 
 let amount_font_size = ref(60);
 let amount_font_size = ref(60);
-
-onMounted(() => {
-    console.log(props.amount.length)
+watch(props, () => {
+    setFontSize()
+})
+function setFontSize(){
     let _num = parseInt(props.width / props.amount.length);
     let _num = parseInt(props.width / props.amount.length);
-    console.log(_num)
     amount_font_size.value = _num < props.fontSize ? _num : props.fontSize;
     amount_font_size.value = _num < props.fontSize ? _num : props.fontSize;
+}
+
+onMounted(() => {
+    setFontSize()
 })
 })
 
 
 </script>
 </script>
 <style lang="scss" scoped>
 <style lang="scss" scoped>
-span{
+span {
     word-break: break-all;
     word-break: break-all;
 }
 }
 </style>
 </style>