Просмотр исходного кода

🔧 fix: 修复取消原因对话框Taro兼容性问题

- 将div元素替换为View组件,符合Taro规范
- 将span和p元素替换为Text组件
- 移除无效的onTap事件
- 保持原有的onClick事件处理

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
Co-Authored-By: Happy <yesreply@happy.engineering>
yourname 1 месяц назад
Родитель
Сommit
425a5e4e84
1 измененных файлов с 14 добавлено и 15 удалено
  1. 14 15
      mini/src/components/common/CancelReasonDialog/index.tsx

+ 14 - 15
mini/src/components/common/CancelReasonDialog/index.tsx

@@ -1,4 +1,5 @@
 import { useState, useEffect } from 'react'
 import { useState, useEffect } from 'react'
+import { View, Text } from '@tarojs/components'
 import {
 import {
   Dialog,
   Dialog,
   DialogContent,
   DialogContent,
@@ -113,11 +114,11 @@ export default function CancelReasonDialog({
           </DialogDescription>
           </DialogDescription>
         </DialogHeader>
         </DialogHeader>
 
 
-        <div className="grid gap-4 py-4">
+        <View className="grid gap-4 py-4">
           {/* 预定义原因选项 */}
           {/* 预定义原因选项 */}
-          <div className="space-y-2">
+          <View className="space-y-2">
             {CANCEL_REASONS.map((reasonText) => (
             {CANCEL_REASONS.map((reasonText) => (
-              <div
+              <View
                 key={reasonText}
                 key={reasonText}
                 data-testid={`cancel-reason-${reasonText}`}
                 data-testid={`cancel-reason-${reasonText}`}
                 className={`px-3 py-2 rounded border cursor-pointer transition-colors select-none ${
                 className={`px-3 py-2 rounded border cursor-pointer transition-colors select-none ${
@@ -126,10 +127,8 @@ export default function CancelReasonDialog({
                     : 'border-gray-300 bg-white hover:bg-gray-50'
                     : 'border-gray-300 bg-white hover:bg-gray-50'
                 }`}
                 }`}
                 onClick={() => handleReasonSelect(reasonText)}
                 onClick={() => handleReasonSelect(reasonText)}
-                // 添加Taro小程序兼容的点击事件处理
-                onTap={() => handleReasonSelect(reasonText)}
               >
               >
-                <span
+                <Text
                   className={`text-sm ${
                   className={`text-sm ${
                     selectedReason === reasonText
                     selectedReason === reasonText
                       ? 'text-primary'
                       ? 'text-primary'
@@ -137,17 +136,17 @@ export default function CancelReasonDialog({
                   }`}
                   }`}
                 >
                 >
                   {reasonText}
                   {reasonText}
-                </span>
-              </div>
+                </Text>
+              </View>
             ))}
             ))}
-          </div>
+          </View>
 
 
           {/* 自定义原因输入 */}
           {/* 自定义原因输入 */}
-          <div className="grid grid-cols-4 items-center gap-4">
+          <View className="grid grid-cols-4 items-center gap-4">
             <Label htmlFor="reason" className="text-right">
             <Label htmlFor="reason" className="text-right">
               其他原因
               其他原因
             </Label>
             </Label>
-            <div className="col-span-3">
+            <View className="col-span-3">
               <Input
               <Input
                 id="reason"
                 id="reason"
                 placeholder="请输入其他取消原因..."
                 placeholder="请输入其他取消原因..."
@@ -156,11 +155,11 @@ export default function CancelReasonDialog({
                 className={error ? 'border-destructive' : ''}
                 className={error ? 'border-destructive' : ''}
               />
               />
               {error && (
               {error && (
-                <p className="text-sm text-destructive mt-1">{error}</p>
+                <Text className="text-sm text-destructive mt-1">{error}</Text>
               )}
               )}
-            </div>
-          </div>
-        </div>
+            </View>
+          </View>
+        </View>
 
 
         <DialogFooter>
         <DialogFooter>
           <Button variant="outline" onClick={handleCancel} disabled={loading}>
           <Button variant="outline" onClick={handleCancel} disabled={loading}>