BUG:#151438 修复li type="input"时的占位字符串故障
This commit is contained in:
parent
4eb6007799
commit
f65d8bf533
|
@ -126,7 +126,6 @@ export default css`
|
||||||
color: var(--li-square);
|
color: var(--li-square);
|
||||||
}
|
}
|
||||||
div#square span {
|
div#square span {
|
||||||
/* margin: var(--auto-_2px) var(--auto-5px) 0px var(--auto-6px); */
|
|
||||||
margin-left: var(--auto-6px);
|
margin-left: var(--auto-6px);
|
||||||
line-height: 0px;
|
line-height: 0px;
|
||||||
}
|
}
|
||||||
|
@ -145,7 +144,7 @@ export default css`
|
||||||
text-align: right;
|
text-align: right;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
font-size: var(--auto-26px);
|
font-size: var(--auto-26px);
|
||||||
line-height: var(--auto-26px);
|
line-height: var(--auto-34px);
|
||||||
color: var(--li-value-default);
|
color: var(--li-value-default);
|
||||||
}
|
}
|
||||||
:host([variant='primary']) span#value {
|
:host([variant='primary']) span#value {
|
||||||
|
|
|
@ -79,6 +79,11 @@ export class StarLi extends StarBaseElement {
|
||||||
|
|
||||||
@property({type: String}) iconcolor!: string
|
@property({type: String}) iconcolor!: string
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 用于支持 type="input"(类原生input标签控制那样)
|
||||||
|
*/
|
||||||
|
@property({type: String}) placeholder!: string
|
||||||
|
|
||||||
/* deprecated */ @property({type: String}) default = ''
|
/* deprecated */ @property({type: String}) default = ''
|
||||||
/* deprecated */ @property({type: Number}) bubble = 0
|
/* deprecated */ @property({type: Number}) bubble = 0
|
||||||
|
|
||||||
|
@ -296,17 +301,10 @@ export class StarLi extends StarBaseElement {
|
||||||
case LiType.INPUT:
|
case LiType.INPUT:
|
||||||
return html`
|
return html`
|
||||||
<input
|
<input
|
||||||
placeholder=${this.value}
|
placeholder=${ifDefined(this.placeholder)}
|
||||||
@focus=${(evt: Event) => {
|
value=${ifDefined(this.value)}
|
||||||
const target = evt.target as HTMLInputElement
|
@focus=${() => this.setAttribute('active', '')}
|
||||||
this.setAttribute('active', '')
|
@blur=${() => this.removeAttribute('active')}
|
||||||
this.value = target.value = target.placeholder
|
|
||||||
}}
|
|
||||||
@blur=${(evt: Event) => {
|
|
||||||
const target = evt.target as HTMLInputElement
|
|
||||||
this.removeAttribute('active')
|
|
||||||
this.value = target.placeholder = target.value
|
|
||||||
}}
|
|
||||||
/>
|
/>
|
||||||
`
|
`
|
||||||
case LiType.EMBED_SLIDER:
|
case LiType.EMBED_SLIDER:
|
||||||
|
|
|
@ -218,6 +218,15 @@ export class PanelLi extends LitElement {
|
||||||
<hr />
|
<hr />
|
||||||
<star-li type="input" label="主机名" value="proxy.example.com"></star-li>
|
<star-li type="input" label="主机名" value="proxy.example.com"></star-li>
|
||||||
<hr />
|
<hr />
|
||||||
|
<star-li
|
||||||
|
type="input"
|
||||||
|
label="主机名"
|
||||||
|
value="proxy.example.com"
|
||||||
|
placeholder="请输入主机名"
|
||||||
|
></star-li>
|
||||||
|
<hr />
|
||||||
|
<star-li type="input" label="主机名" placeholder="请输入主机名"></star-li>
|
||||||
|
<hr />
|
||||||
<star-li type="button" label="添加其他网络"></star-li>
|
<star-li type="button" label="添加其他网络"></star-li>
|
||||||
<hr />
|
<hr />
|
||||||
<star-li type="button" variant="primary" label="添加其他网络"></star-li>
|
<star-li type="button" variant="primary" label="添加其他网络"></star-li>
|
||||||
|
|
Loading…
Reference in New Issue