feat: Search新增customInputClass,placeholderClass等属性 (#845)

 Closes: #299
This commit is contained in:
derrick 2025-01-18 16:10:06 +08:00 committed by GitHub
parent 7a0d5ce972
commit 03623f4989
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 18 additions and 4 deletions

View File

@ -155,6 +155,8 @@ function changeSearchType({ item, index }) {
| ~~use-suffix-slot~~ | ~~是否使用输入框右侧插槽~~**(已废弃,将在下一个 minor 版本被移除,直接使用插槽即可)** | boolean | - | false | - |
| focus | 是否自动聚焦 | boolean | - | false | 0.1.63 |
| focusWhenClear | 是否在点击清除按钮时聚焦输入框 | boolean | - | false | 0.1.63 |
| placeholderStyle | 原生属性,指定 placeholder 的样式目前仅支持color,font-size和font-weight | string | - | - | $LOWEST_VERSION$ |
| placeholderClass | 原生属性,指定 placeholder 的样式类 | string | - | - | $LOWEST_VERSION$ |
## Events
@ -179,3 +181,4 @@ function changeSearchType({ item, index }) {
| 类名 | 说明 | 最低版本 |
| ------------ | ---------- | -------- |
| custom-class | 根节点样式 | - |
| custom-input-class | input 外部自定义样式 | $LOWEST_VERSION$ |

View File

@ -11,7 +11,7 @@ import { baseProps, makeBooleanProp, makeNumberProp, makeNumericProp, makeString
export const searchProps = {
...baseProps,
customInputClass: makeStringProp(''),
/**
*
* 类型: string
@ -88,5 +88,15 @@ export const searchProps = {
* 默认值: false
* 最低版本: 0.1.63
*/
focusWhenClear: makeBooleanProp(false)
focusWhenClear: makeBooleanProp(false),
/**
* placeholder color,font-size和font-weight
*/
placeholderStyle: String,
/**
* placeholder
*/
placeholderClass: makeStringProp('')
}

View File

@ -11,10 +11,11 @@
<input
v-if="showInput || str || placeholderLeft"
:placeholder="placeholder || translate('search')"
placeholder-class="wd-search__placeholder-txt"
:placeholder-class="`wd-search__placeholder-txt', ${placeholderClass}`"
:placeholder-style="placeholderStyle"
confirm-type="search"
v-model="str"
class="wd-search__input"
:class="['wd-search__input', customInputClass]"
@focus="searchFocus"
@input="inputValue"
@blur="searchBlur"