BUG:#151438 修复li type="input"时的占位字符串故障

This commit is contained in:
wangchangqi 2022-12-30 15:00:28 +08:00
parent 4eb6007799
commit f65d8bf533
3 changed files with 19 additions and 13 deletions

View File

@ -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 {

View File

@ -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:

View File

@ -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>