fix(exception): modify mobile problem (#2690)

Author: James-9696

examples/sites/demos/mobile/app/exception/buttonText.vue

@@ -1,11 +1,6 @@
 <template>
   <div class="tiny-mobile-exception-demo">
-    <tiny-exception
-      type="nodata"
-      button-text="重试"
-      :imageUrl="imageUrl"
-      message="网络异常，请稍后再试，或者联系管理员给您处理"
-    ></tiny-exception>
+    <tiny-exception type="nodata" button-text="重试" :imageUrl="imageUrl"></tiny-exception>
   </div>
 </template>
 

examples/sites/demos/mobile/app/exception/exceptionClass.vue

@@ -4,27 +4,31 @@
       type="nodata"
       button-text="重试"
       :imageUrl="imageUrl"
+      :exception-class="exceptionClass"
       message="网络异常，请稍后再试，或者联系管理员给您处理"
     ></tiny-exception>
   </div>
 </template>
 
 <script lang="jsx">
-import { TinyException } from '@opentiny/vue-mobile'
+import { Exception } from '@opentiny/vue'
 
 export default {
   components: {
-    TinyException
+    TinyException: Exception
   },
   data() {
     return {
-      imageUrl: `${import.meta.env.VITE_APP_BUILD_BASE_URL}static/images/planet1.jpg`
+      imageUrl: `${import.meta.env.VITE_APP_BUILD_BASE_URL}static/images/planet1.jpg`,
+      exceptionClass: 'no-problem'
     }
   },
-  methods: {
-    test() {
-      alert(11)
-    }
-  }
+  methods: {}
 }
 </script>
+
+<style lang="less">
+.no-problem {
+  background-color: pink;
+}
+</style>

examples/sites/demos/mobile/app/exception/message.vue

@@ -1,6 +1,6 @@
 <template>
   <div class="tiny-mobile-exception-demo">
-    <tiny-exception type="nodata" message="自定义文本内容" :imageUrl="imageUrl" @btn-click="test"></tiny-exception>
+    <tiny-exception type="nodata" message="自定义文本内容" @btn-click="test"></tiny-exception>
   </div>
 </template>
 
@@ -12,9 +12,7 @@ export default {
     TinyException
   },
   data() {
-    return {
-      imageUrl: `${import.meta.env.VITE_APP_BUILD_BASE_URL}static/images/planet1.jpg`
-    }
+    return {}
   },
   methods: {
     test() {

packages/mobile/components/exception/src/exception.ts

@@ -3,6 +3,7 @@ export const exceptionProps = {
     type: String,
     default: 'nodata'
   },
+  buttonText: String,
   message: String,
   subMessage: String,
   exceptionClass: String,

packages/mobile/components/exception/src/mobile.vue

@@ -17,7 +17,7 @@
       <slot name="content">
         <div class="tiny-mobile-exception__content-message">
           <div class="main-message">
-            {{ state.message }}
+            {{ message }}
           </div>
           <div v-if="subMessage" class="sub-message">
             {{ subMessage }}