From 2b1c13133eb890c846fbbbf49cbcc7a0ac0d009b Mon Sep 17 00:00:00 2001
From: taohebin <taohebin@dcloud.io>
Date: Wed, 13 Dec 2023 17:17:00 +0800
Subject: [PATCH] =?UTF-8?q?feat:=20input=E3=80=81textarea=E5=A2=9E?=
 =?UTF-8?q?=E5=8A=A0cursor-color=E7=9A=84=E7=94=A8=E4=BE=8B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages/component/input/input.test.js       |  8 ++++++++
 pages/component/input/input.uvue          | 23 ++++++++++++++++++++---
 pages/component/textarea/textarea.test.js |  7 +++++++
 pages/component/textarea/textarea.uvue    | 16 ++++++++++++----
 4 files changed, 47 insertions(+), 7 deletions(-)

diff --git a/pages/component/input/input.test.js b/pages/component/input/input.test.js
index fe7fd79e..d2d3962e 100644
--- a/pages/component/input/input.test.js
+++ b/pages/component/input/input.test.js
@@ -139,6 +139,14 @@ describe('component-native-input', () => {
   //   await page.waitFor(500)
   // })
 
+  it("cursor-color", async () => {
+    await page.setData({
+      cursor_color: "transparent",
+    })
+    await page.waitFor(500)
+    expect(await (await page.$('.uni-input-cursor-color')).property("cursor-color")).toBe("transparent")
+  })
+
   it("afterAllTestScreenshot", async () => {
     const image = await program.screenshot({
       fullPage: true
diff --git a/pages/component/input/input.uvue b/pages/component/input/input.uvue
index 91017ae2..d6bf8461 100644
--- a/pages/component/input/input.uvue
+++ b/pages/component/input/input.uvue
@@ -77,8 +77,8 @@
         <view class="uni-input-wrapper">
           <input class="uni-input" :cursor-spacing="1000" placeholder="光标与键盘的距离为1000px" />
         </view>
-      </view>
-
+      </view>
+
       <view>
         <view class="uni-title">
           <text class="uni-title-text">自动获取焦点</text>
@@ -134,6 +134,15 @@
         <view class="uni-input-wrapper">
           <input ref="input2" class="uni-input" value="0123456789" :selection-start="selectionStart" :selection-end="selectionEnd" />
         </view>
+      </view>
+
+      <view>
+        <view class="uni-title" @click="changeCursorColor">
+          <text class="uni-title-text">设置光标颜色为透明（点击生效，再点复位）</text>
+        </view>
+        <view class="uni-input-wrapper">
+          <input class="uni-input uni-input-cursor-color" :cursor-color="cursor_color" value="光标颜色" />
+        </view>
       </view>
 
       <view>
@@ -218,7 +227,8 @@
         showClearIcon: false,
         inputClearValue: '',
         showPassword: true,
-        cursor: -1,
+        cursor: -1,
+        cursor_color: "#3393E2",
         selectionStart: -1,
         selectionEnd: -1,
         inputEventDetail: '',
@@ -290,6 +300,13 @@
       },
       test_check_input_value():number {
         return this.onMaxLengthInputValue.length
+      },
+      changeCursorColor(){
+        if(this.cursor_color == "#3393E2"){
+          this.cursor_color = "transparent"
+        }else{
+          this.cursor_color = "#3393E2"
+        }
       }
     }
   }
diff --git a/pages/component/textarea/textarea.test.js b/pages/component/textarea/textarea.test.js
index b8472b67..76770603 100644
--- a/pages/component/textarea/textarea.test.js
+++ b/pages/component/textarea/textarea.test.js
@@ -61,6 +61,13 @@ describe('component-native-textarea', () => {
     } = await textarea.size()
     expect(height).toBeLessThanOrEqual(150)
   }) */
+  it("cursor-color", async () => {
+    await page.setData({
+      cursor_color: "transparent",
+    })
+    await page.waitFor(500)
+    expect(await textarea.property("cursor-color")).toBe("transparent")
+  })
 
   it("inputmode", async () => {
     const inputmodeEnum = await page.data("inputmode_enum")
diff --git a/pages/component/textarea/textarea.uvue b/pages/component/textarea/textarea.uvue
index 38c7ba2c..21e5590d 100644
--- a/pages/component/textarea/textarea.uvue
+++ b/pages/component/textarea/textarea.uvue
@@ -12,7 +12,8 @@ export default {
 			auto_focus_boolean: false,
       default_value:"",
       maxlength:-1,
-			inputmode_enum: [{"value":0,"name":"none"},{"value":1,"name":"text"},{"value":2,"name":"decimal"},{"value":3,"name":"numeric"},{"value":4,"name":"tel"},{"value":5,"name":"search"},{"value":6,"name":"email"},{"value":7,"name":"url"}] as ItemType[],
+			inputmode_enum: [{"value":0,"name":"none"},{"value":1,"name":"text"},{"value":2,"name":"decimal"},{"value":3,"name":"numeric"},{"value":4,"name":"tel"},{"value":5,"name":"search"},{"value":6,"name":"email"},{"value":7,"name":"url"}] as ItemType[],
+      cursor_color: "#3393E2",
 			inputmode_enum_current: 0
 		}
 	},
@@ -37,7 +38,8 @@ export default {
 		change_auto_height_boolean(checked : boolean) { this.auto_height_boolean = checked },
 		change_confirm_hold_boolean(checked : boolean) { this.confirm_hold_boolean = checked },
 		change_focus_boolean(checked : boolean) { this.focus_boolean = checked },
-		change_auto_focus_boolean(checked : boolean) { this.auto_focus_boolean = checked },
+		change_auto_focus_boolean(checked : boolean) { this.auto_focus_boolean = checked },
+    change_cursor_color_boolean(checked : boolean) { if(checked){ this.cursor_color = "transparent"} else {this.cursor_color = "#3393E2"}},
 		radio_change_inputmode_enum(checked : number) { this.inputmode_enum_current = checked }
 	}
 }
@@ -54,7 +56,8 @@ export default {
       :auto-height="auto_height_boolean"
       :fixed="fixed_boolean"
       :show-confirm-bar="show_confirm_bar_boolean"
-      :adjust-position="adjust_position_boolean"
+      :adjust-position="adjust_position_boolean"
+      :cursor-color="cursor_color"
       :inputmode="inputmode_enum[inputmode_enum_current].name"
       :maxlength="maxlength"
       @click="textarea_click"
@@ -114,6 +117,11 @@ export default {
         :defaultValue="false"
         title="自动获取焦点"
         @change="change_auto_focus_boolean"
+      ></boolean-data>
+      <boolean-data
+        :defaultValue="false"
+        title="改变光标颜色为透明"
+        @change="change_cursor_color_boolean"
       ></boolean-data>
       <enum-data
         :items="inputmode_enum"
@@ -132,7 +140,7 @@ export default {
   padding: 10rpx 0;
   border-bottom: 1px solid rgba(0, 0, 0, 0.06);
   flex-direction: row;
-  justify-content: center;
+  justify-content: center;
 }
 
 .main .list-item {
-- 
GitLab