订单售后v3

src/components/textareaEnhance/index.module.scss

@@ -0,0 +1,36 @@
+.other_desc{
+    // padding: 0 20px;
+    box-sizing: border-box;
+    .title{
+        font-size: $font_size;
+        font-weight: 700;
+    }
+    .textarea{
+        position: relative;
+        height: 165.4px;
+        .descDataNum{
+            position: absolute;
+            right: 10px;
+            bottom: 10px;
+            font-size: 22px;
+            color: #ABABAB;
+        }
+    }
+    .textarea_con, .textarea_con_pretend{
+        background-color: #f3f3f3;
+        border: 2px solid #e6e6e6;
+        border-radius: 10px;
+        width: 100%;
+        font-size: 25px;
+        height: 165.4px;
+        padding: 20px 20px 30px 20px;
+        box-sizing: border-box;
+        margin-top: 20px;
+    }
+    .textarea_con_pretend{
+        color: $color_font_two;
+    }
+    .textarea_con_pretend_ed{
+        color: #000;
+    }
+}

src/components/textareaEnhance/index.tsx

@@ -0,0 +1,43 @@
+import {Textarea, View } from "@tarojs/components";
+import { memo, useMemo, useState } from "react";
+import styles  from './index.module.scss'
+import classnames from "classnames";
+
+//其他说明
+type Param = {
+    title?: string,
+    onChange?: (val: string) => void,
+    placeholder?: string
+}
+export default memo(({onChange, title = '', placeholder = '请输入'}:Param) => {
+    const [descData, setDescData] = useState({
+        number: 0,
+        value: '',
+        count: 200,
+        show: false
+    })
+    const getDesc = (e) => {
+        let value = e.detail.value
+        let res = value
+        if(value.length > descData.count) {
+            res = value.slice(0, descData.count)
+        }
+        setDescData({...descData, number:res.length, value: res})
+        onChange?.(res)
+    }
+
+    const toggleShowRealTextarea = (show) => {
+        setDescData({...descData, show:show})
+    }
+    return (
+        <View className={styles.other_desc}>
+            <View className={styles.title}>{title}</View>
+            <View className={styles.textarea}>
+                {descData.show&&<Textarea autoFocus value={descData.value} onBlur={() => toggleShowRealTextarea(false)} className={styles.textarea_con} cursorSpacing={100} maxlength={descData.count} onInput={(e) => getDesc(e)}></Textarea>||
+                    <View className={classnames(styles.textarea_con_pretend, descData.value&&styles.textarea_con_pretend_ed)} onClick={() => toggleShowRealTextarea(true)}>{descData.value||placeholder}</View>
+                }
+                <View className={styles.descDataNum}>{descData.number +'/'+ descData.count}</View>
+            </View>
+        </View>
+    )
+})