From 701df979688e893dee208aafcb3b899cb46fa325 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E9=BB=8E=E4=BC=9F=E6=9D=B0?= <674416404@qq.com>
Date: Thu, 27 Jun 2024 22:23:55 +0800
Subject: [PATCH] docs(search): backup type file
---
.../tdesign-miniprogram/src/search/props.ts | 113 ++++++++-----
.../tdesign-miniprogram/src/search/type.ts | 153 ++++++++++++------
2 files changed, 175 insertions(+), 91 deletions(-)
diff --git a/packages/products/tdesign-miniprogram/src/search/props.ts b/packages/products/tdesign-miniprogram/src/search/props.ts
index 870e1cde..e875653e 100644
--- a/packages/products/tdesign-miniprogram/src/search/props.ts
+++ b/packages/products/tdesign-miniprogram/src/search/props.ts
@@ -6,17 +6,18 @@
import { TdSearchProps } from './type';
const props: TdSearchProps = {
- /** 用于自定义搜索框右侧内容,如:“取消” */
+ /** 自定义右侧操作按钮文字 */
action: {
type: String,
value: '',
},
- /** 【开发中】联想词列表,如果不存在或长度为 0 则不显示联想框。可以使用函数 `label` 自定义联想词为任意内容;也可使用插槽 `option` 定义联想词内容,插槽参数为 `{ option: AutocompleteOption; index: number }`。如果 `group` 值为 `true` 则表示当前项为分组标题 */
- autocompleteOptions: {
- type: Array,
+ /** 键盘弹起时,是否自动上推页面 */
+ adjustPosition: {
+ type: Boolean,
+ value: true,
},
- /** 是否默认聚焦 */
- autofocus: {
+ /** 强制 input 处于同层状态,默认 focus 时 input 会切到非同层状态 (仅在 iOS 下生效) */
+ alwaysEmbed: {
type: Boolean,
value: false,
},
@@ -25,47 +26,90 @@ const props: TdSearchProps = {
type: Boolean,
value: false,
},
- /** 是否可清空 */
+ /** 是否启用清除控件 */
clearable: {
type: Boolean,
value: true,
},
- /** 禁用状态 */
- disabled: {
+ /** 点击键盘右下角按钮时是否保持键盘不收起 */
+ confirmHold: {
type: Boolean,
+ value: false,
},
- /** 组件外部样式类名,分别用于设置组件外层类名、输入框类名、输入框容器类名、右侧 cancel 文本类名、左侧图标类名、右侧图标类型 */
- externalClasses: {
- type: Array,
+ /** 设置键盘右下角按钮的文字,仅在type='text'时生效。
具体释义:
`send` 右下角按钮为“发送”;
`search` 右下角按钮为“搜索”;
`next` 右下角按钮为“下一个”;
`go` 右下角按钮为“前往”;
`done` 右下角按钮为“完成”。
[小程序官方文档](https://developers.weixin.qq.com/miniprogram/dev/component/input.html) */
+ confirmType: {
+ type: String,
+ value: 'search',
+ },
+ /** 指定 focus 时的光标位置 */
+ cursor: {
+ type: Number,
+ required: true,
},
- /** 自定义过滤方法,用于对现有数据进行搜索过滤,判断是否过滤某一项数据。其中参数 `keyword` 指当前的搜索词,参数 `option` 指每一项联想词,函数返回 true 则显示当前联想词,函数返回 `false` 则隐藏当前联想词 */
- filter: {
- type: null,
+ /** 搜索框聚焦时底部与键盘的距离 */
+ cursorSpacing: {
+ type: Number,
+ value: 0,
},
- /** 是否聚焦,同小程序官方属性 */
+ /** 是否禁用 */
+ disabled: {
+ type: Boolean,
+ value: false,
+ },
+ /** 是否聚焦 */
focus: {
type: Boolean,
value: false,
},
- /** 搜索框内部左侧内容,位于 `prefixIcon` 左侧 */
- label: {
+ /** focus时,点击页面的时候不收起键盘 */
+ holdKeyboard: {
+ type: Boolean,
+ value: false,
+ },
+ /** 左侧图标 */
+ leftIcon: {
type: String,
- value: '',
+ value: 'search',
+ },
+ /** 用户最多可以输入的字符个数,一个中文汉字表示两个字符长度。`maxcharacter` 和 `maxlength` 二选一使用 */
+ maxcharacter: {
+ type: Number,
+ },
+ /** 用户最多可以输入的文本长度,一个中文等于一个计数长度。默认为 -1,不限制输入长度。`maxcharacter` 和 `maxlength` 二选一使用 */
+ maxlength: {
+ type: Number,
+ value: -1,
},
/** 占位符 */
placeholder: {
type: String,
value: '',
},
- /** 前置图标,默认为搜索图标。值为 `null` 时则不显示 */
- prefixIcon: {
+ /** 指定 placeholder 的样式类 */
+ placeholderClass: {
type: String,
- value: 'search',
+ value: 'input-placeholder',
},
- /** 只读状态 */
- readonly: {
- type: Boolean,
- value: false,
+ /** 指定 placeholder 的样式 */
+ placeholderStyle: {
+ type: String,
+ value: '',
+ required: true,
+ },
+ /** 预览结果列表 */
+ resultList: {
+ type: Array,
+ value: [],
+ },
+ /** 光标结束位置,自动聚集时有效,需与 selection-start 搭配使用 */
+ selectionEnd: {
+ type: Number,
+ value: -1,
+ },
+ /** 光标起始位置,自动聚集时有效,需与 selection-end 搭配使用 */
+ selectionStart: {
+ type: Number,
+ value: -1,
},
/** 搜索框形状 */
shape: {
@@ -77,22 +121,13 @@ const props: TdSearchProps = {
type: String,
value: '',
},
- /** 搜索框内部右侧内容,位于 `suffixIcon` 右侧 */
- suffix: {
- type: String,
- value: '',
- },
- /** 后置图标 */
- suffixIcon: {
+ /** 拉起键盘的类型 */
+ type: {
type: String,
+ value: 'text',
},
- /** 值,搜索关键词 */
+ /** 值 */
value: {
- type: String,
- value: null,
- },
- /** 值,搜索关键词,非受控属性 */
- defaultValue: {
type: String,
value: '',
},
diff --git a/packages/products/tdesign-miniprogram/src/search/type.ts b/packages/products/tdesign-miniprogram/src/search/type.ts
index 6665e1f5..574c2497 100644
--- a/packages/products/tdesign-miniprogram/src/search/type.ts
+++ b/packages/products/tdesign-miniprogram/src/search/type.ts
@@ -6,7 +6,7 @@
export interface TdSearchProps {
/**
- * 用于自定义搜索框右侧内容,如:“取消”
+ * 自定义右侧操作按钮文字
* @default ''
*/
action?: {
@@ -14,17 +14,18 @@ export interface TdSearchProps {
value?: string;
};
/**
- * 【开发中】联想词列表,如果不存在或长度为 0 则不显示联想框。可以使用函数 `label` 自定义联想词为任意内容;也可使用插槽 `option` 定义联想词内容,插槽参数为 `{ option: AutocompleteOption; index: number }`。如果 `group` 值为 `true` 则表示当前项为分组标题
+ * 键盘弹起时,是否自动上推页面
+ * @default true
*/
- autocompleteOptions?: {
- type: ArrayConstructor;
- value?: Array;
+ adjustPosition?: {
+ type: BooleanConstructor;
+ value?: boolean;
};
/**
- * 是否默认聚焦
+ * 强制 input 处于同层状态,默认 focus 时 input 会切到非同层状态 (仅在 iOS 下生效)
* @default false
*/
- autofocus?: {
+ alwaysEmbed?: {
type: BooleanConstructor;
value?: boolean;
};
@@ -37,7 +38,7 @@ export interface TdSearchProps {
value?: boolean;
};
/**
- * 是否可清空
+ * 是否启用清除控件
* @default true
*/
clearable?: {
@@ -45,28 +46,46 @@ export interface TdSearchProps {
value?: boolean;
};
/**
- * 禁用状态
+ * 点击键盘右下角按钮时是否保持键盘不收起
+ * @default false
*/
- disabled?: {
+ confirmHold?: {
type: BooleanConstructor;
value?: boolean;
};
/**
- * 组件外部样式类名,分别用于设置组件外层类名、输入框类名、输入框容器类名、右侧 cancel 文本类名、左侧图标类名、右侧图标类型
+ * 设置键盘右下角按钮的文字,仅在type='text'时生效。
具体释义:
`send` 右下角按钮为“发送”;
`search` 右下角按钮为“搜索”;
`next` 右下角按钮为“下一个”;
`go` 右下角按钮为“前往”;
`done` 右下角按钮为“完成”。
[小程序官方文档](https://developers.weixin.qq.com/miniprogram/dev/component/input.html)
+ * @default search
*/
- externalClasses?: {
- type: ArrayConstructor;
- value?: ['t-class', 't-class-input', 't-class-input-container', 't-class-cancel', 't-class-left', 't-class-right'];
+ confirmType?: {
+ type: StringConstructor;
+ value?: 'send' | 'search' | 'next' | 'go' | 'done';
};
/**
- * 自定义过滤方法,用于对现有数据进行搜索过滤,判断是否过滤某一项数据。其中参数 `keyword` 指当前的搜索词,参数 `option` 指每一项联想词,函数返回 true 则显示当前联想词,函数返回 `false` 则隐藏当前联想词
+ * 指定 focus 时的光标位置
*/
- filter?: {
- type: undefined;
- value?: (keyword: string, option: any) => boolean | Promise;
+ cursor: {
+ type: NumberConstructor;
+ value?: number;
+ };
+ /**
+ * 搜索框聚焦时底部与键盘的距离
+ * @default 0
+ */
+ cursorSpacing?: {
+ type: NumberConstructor;
+ value?: number;
+ };
+ /**
+ * 是否禁用
+ * @default false
+ */
+ disabled?: {
+ type: BooleanConstructor;
+ value?: boolean;
};
/**
- * 是否聚焦,同小程序官方属性
+ * 是否聚焦
* @default false
*/
focus?: {
@@ -74,13 +93,36 @@ export interface TdSearchProps {
value?: boolean;
};
/**
- * 搜索框内部左侧内容,位于 `prefixIcon` 左侧
- * @default ''
+ * focus时,点击页面的时候不收起键盘
+ * @default false
+ */
+ holdKeyboard?: {
+ type: BooleanConstructor;
+ value?: boolean;
+ };
+ /**
+ * 左侧图标
+ * @default 'search'
*/
- label?: {
+ leftIcon?: {
type: StringConstructor;
value?: string;
};
+ /**
+ * 用户最多可以输入的字符个数,一个中文汉字表示两个字符长度。`maxcharacter` 和 `maxlength` 二选一使用
+ */
+ maxcharacter?: {
+ type: NumberConstructor;
+ value?: number;
+ };
+ /**
+ * 用户最多可以输入的文本长度,一个中文等于一个计数长度。默认为 -1,不限制输入长度。`maxcharacter` 和 `maxlength` 二选一使用
+ * @default -1
+ */
+ maxlength?: {
+ type: NumberConstructor;
+ value?: number;
+ };
/**
* 占位符
* @default ''
@@ -90,20 +132,44 @@ export interface TdSearchProps {
value?: string;
};
/**
- * 前置图标,默认为搜索图标。值为 `null` 时则不显示
- * @default 'search'
+ * 指定 placeholder 的样式类
+ * @default input-placeholder
*/
- prefixIcon?: {
+ placeholderClass?: {
type: StringConstructor;
value?: string;
};
/**
- * 只读状态
- * @default false
+ * 指定 placeholder 的样式
+ * @default ''
*/
- readonly?: {
- type: BooleanConstructor;
- value?: boolean;
+ placeholderStyle: {
+ type: StringConstructor;
+ value?: string;
+ };
+ /**
+ * 预览结果列表
+ * @default []
+ */
+ resultList?: {
+ type: ArrayConstructor;
+ value?: Array;
+ };
+ /**
+ * 光标结束位置,自动聚集时有效,需与 selection-start 搭配使用
+ * @default -1
+ */
+ selectionEnd?: {
+ type: NumberConstructor;
+ value?: number;
+ };
+ /**
+ * 光标起始位置,自动聚集时有效,需与 selection-end 搭配使用
+ * @default -1
+ */
+ selectionStart?: {
+ type: NumberConstructor;
+ value?: number;
};
/**
* 搜索框形状
@@ -122,36 +188,19 @@ export interface TdSearchProps {
value?: string;
};
/**
- * 搜索框内部右侧内容,位于 `suffixIcon` 右侧
- * @default ''
- */
- suffix?: {
- type: StringConstructor;
- value?: string;
- };
- /**
- * 后置图标
+ * 拉起键盘的类型
+ * @default 'text'
*/
- suffixIcon?: {
+ type?: {
type: StringConstructor;
- value?: string;
+ value?: 'text' | 'number' | 'idcard' | 'digit' | 'nickname';
};
/**
- * 值,搜索关键词
+ * 值
* @default ''
*/
value?: {
type: StringConstructor;
value?: string;
};
- /**
- * 值,搜索关键词,非受控属性
- * @default ''
- */
- defaultValue?: {
- type: StringConstructor;
- value?: string;
- };
}
-
-export type AutocompleteOption = string | { label: string; group?: boolean };