icon组件改用name
parent
615ef62853
commit
4bb1474ff2
|
@ -257,7 +257,7 @@ class Button extends Component {
|
||||||
render() {
|
render() {
|
||||||
return html`
|
return html`
|
||||||
<button ref="btn" disabled=${this.disabled}>
|
<button ref="btn" disabled=${this.disabled}>
|
||||||
<wc-icon class="icon" is=${this.icon}></wc-icon>
|
<wc-icon class="icon" name=${this.icon}></wc-icon>
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</button>
|
</button>
|
||||||
`
|
`
|
||||||
|
|
|
@ -234,7 +234,7 @@ class Passwd extends Component {
|
||||||
<wc-icon
|
<wc-icon
|
||||||
class="icon"
|
class="icon"
|
||||||
@click=${this.iconClick}
|
@click=${this.iconClick}
|
||||||
:is=${this._type === 'password' ? 'eye' : 'eye-off'}
|
:name=${this._type === 'password' ? 'eye' : 'eye-off'}
|
||||||
></wc-icon>
|
></wc-icon>
|
||||||
</div>
|
</div>
|
||||||
`
|
`
|
||||||
|
|
|
@ -15,12 +15,12 @@ if (window.EXT_SVG_DICT) {
|
||||||
|
|
||||||
class Icon extends Component {
|
class Icon extends Component {
|
||||||
static props = {
|
static props = {
|
||||||
is: {
|
name: {
|
||||||
type: String,
|
type: String,
|
||||||
default: null,
|
default: null,
|
||||||
observer(val) {
|
observer(val) {
|
||||||
if (val === '') {
|
if (val === '') {
|
||||||
this.is = null
|
this.name = null
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -32,7 +32,7 @@ class Icon extends Component {
|
||||||
width: var(--size, 36px);
|
width: var(--size, 36px);
|
||||||
height: var(--size, 36px);
|
height: var(--size, 36px);
|
||||||
}
|
}
|
||||||
:host(:not([is])) {
|
:host(:not([name])) {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
.icon {
|
.icon {
|
||||||
|
@ -93,12 +93,12 @@ class Icon extends Component {
|
||||||
render() {
|
render() {
|
||||||
return html`
|
return html`
|
||||||
<svg
|
<svg
|
||||||
class="icon ${this.is === 'loading' ? 'loading' : ''}"
|
class="icon ${this.name === 'loading' ? 'loading' : ''}"
|
||||||
viewBox="0 0 1024 1024"
|
viewBox="0 0 1024 1024"
|
||||||
>
|
>
|
||||||
${this.is === 'loading'
|
${this.name === 'loading'
|
||||||
? svg`<circle class="circle" cx="512" cy="512" r="384" fill="none" stroke-width="80" />`
|
? svg`<circle class="circle" cx="512" cy="512" r="384" fill="none" stroke-width="80" />`
|
||||||
: svg`<path d="${dict[this.is]}" />`}
|
: svg`<path d="${dict[this.name]}" />`}
|
||||||
</svg>
|
</svg>
|
||||||
`
|
`
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue