mirror of
https://gitee.com/wot-design-uni/wot-design-uni.git
synced 2025-12-07 01:28:30 +08:00
feat: ✨ Search新增customInputClass,placeholderClass等属性 (#845)
✅ Closes: #299
This commit is contained in:
parent
7a0d5ce972
commit
03623f4989
@ -155,6 +155,8 @@ function changeSearchType({ item, index }) {
|
|||||||
| ~~use-suffix-slot~~ | ~~是否使用输入框右侧插槽~~**(已废弃,将在下一个 minor 版本被移除,直接使用插槽即可)** | boolean | - | false | - |
|
| ~~use-suffix-slot~~ | ~~是否使用输入框右侧插槽~~**(已废弃,将在下一个 minor 版本被移除,直接使用插槽即可)** | boolean | - | false | - |
|
||||||
| focus | 是否自动聚焦 | boolean | - | false | 0.1.63 |
|
| focus | 是否自动聚焦 | boolean | - | false | 0.1.63 |
|
||||||
| focusWhenClear | 是否在点击清除按钮时聚焦输入框 | 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
|
## Events
|
||||||
|
|
||||||
@ -179,3 +181,4 @@ function changeSearchType({ item, index }) {
|
|||||||
| 类名 | 说明 | 最低版本 |
|
| 类名 | 说明 | 最低版本 |
|
||||||
| ------------ | ---------- | -------- |
|
| ------------ | ---------- | -------- |
|
||||||
| custom-class | 根节点样式 | - |
|
| custom-class | 根节点样式 | - |
|
||||||
|
| custom-input-class | input 外部自定义样式 | $LOWEST_VERSION$ |
|
||||||
|
|||||||
@ -11,7 +11,7 @@ import { baseProps, makeBooleanProp, makeNumberProp, makeNumericProp, makeString
|
|||||||
|
|
||||||
export const searchProps = {
|
export const searchProps = {
|
||||||
...baseProps,
|
...baseProps,
|
||||||
|
customInputClass: makeStringProp(''),
|
||||||
/**
|
/**
|
||||||
* 输入框内容,双向绑定
|
* 输入框内容,双向绑定
|
||||||
* 类型: string
|
* 类型: string
|
||||||
@ -88,5 +88,15 @@ export const searchProps = {
|
|||||||
* 默认值: false
|
* 默认值: false
|
||||||
* 最低版本: 0.1.63
|
* 最低版本: 0.1.63
|
||||||
*/
|
*/
|
||||||
focusWhenClear: makeBooleanProp(false)
|
focusWhenClear: makeBooleanProp(false),
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 原生属性,指定 placeholder 的样式,目前仅支持color,font-size和font-weight
|
||||||
|
*/
|
||||||
|
placeholderStyle: String,
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 原生属性,指定 placeholder 的样式类
|
||||||
|
*/
|
||||||
|
placeholderClass: makeStringProp('')
|
||||||
}
|
}
|
||||||
|
|||||||
@ -11,10 +11,11 @@
|
|||||||
<input
|
<input
|
||||||
v-if="showInput || str || placeholderLeft"
|
v-if="showInput || str || placeholderLeft"
|
||||||
:placeholder="placeholder || translate('search')"
|
:placeholder="placeholder || translate('search')"
|
||||||
placeholder-class="wd-search__placeholder-txt"
|
:placeholder-class="`wd-search__placeholder-txt', ${placeholderClass}`"
|
||||||
|
:placeholder-style="placeholderStyle"
|
||||||
confirm-type="search"
|
confirm-type="search"
|
||||||
v-model="str"
|
v-model="str"
|
||||||
class="wd-search__input"
|
:class="['wd-search__input', customInputClass]"
|
||||||
@focus="searchFocus"
|
@focus="searchFocus"
|
||||||
@input="inputValue"
|
@input="inputValue"
|
||||||
@blur="searchBlur"
|
@blur="searchBlur"
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user