Browse Source

fix(tips_report): 修复示例图片无法正确加载的问题

将静态图片路径改为Vue组件式导入绑定,解决生产环境下图片资源加载失败的问题
DengPeng 2 weeks ago
parent
commit
3975aeceb9
3 changed files with 6 additions and 4 deletions
  1. BIN
      src/assets/case-negative.png
  2. BIN
      src/assets/case-positive.png
  3. 6 4
      src/views/tips_report.vue

BIN
src/assets/case-negative.png


BIN
src/assets/case-positive.png


+ 6 - 4
src/views/tips_report.vue

@@ -187,11 +187,11 @@
                     </button>
                     <div class="case-card positive">
                       <div class="case-title">正确示例</div>
-                      <img src="/case-positive.png" alt="正确示例" />
+                      <img :src="casePositiveImg" alt="正确示例" />
                     </div>
                     <div class="case-card negative">
                       <div class="case-title">错误示例</div>
-                      <img src="/case-negative.png" alt="错误示例" />
+                      <img :src="caseNegativeImg" alt="错误示例" />
                     </div>
                   </div>
                 </div>
@@ -211,11 +211,11 @@
         <div class="case-viewer-body">
           <div class="case-viewer-card positive">
             <div class="case-viewer-title">正确示例</div>
-            <img src="/case-positive.png" alt="正确示例" />
+            <img :src="casePositiveImg" alt="正确示例" />
           </div>
           <div class="case-viewer-card negative">
             <div class="case-viewer-title">错误示例</div>
-            <img src="/case-negative.png" alt="错误示例" />
+            <img :src="caseNegativeImg" alt="错误示例" />
           </div>
         </div>
       </div>
@@ -226,6 +226,8 @@
 
 <script setup>
 import { ref, computed } from 'vue'
+import casePositiveImg from '../assets/case-positive.png'
+import caseNegativeImg from '../assets/case-negative.png'
 
 const taskList = ref([
   {