This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0

优化样式及事件触发

old
yutent 2023-02-27 19:19:13 +08:00
parent 94e38eb83f
commit c8f99088ff
5 changed files with 14 additions and 7 deletions

View File

@ -229,7 +229,7 @@ export default class Radio {
this.checked = true this.checked = true
this.parentNode.dispatchEvent(new CustomEvent('child-picked', { detail: this.value })) $.fire(this.parentNode, 'child-picked', { value: this.value })
} }
mounted() { mounted() {

View File

@ -100,7 +100,8 @@ export default class RadioGroup {
mounted() { mounted() {
this._pickedFn = $.bind(this, 'child-picked', ev => { this._pickedFn = $.bind(this, 'child-picked', ev => {
this.value = ev.detail this.value = ev.detail
this.dispatchEvent(new CustomEvent('input')) $.fire(this, 'input')
$.fire(this, 'change')
}) })
this.__observer = new MutationObserver(_ => { this.__observer = new MutationObserver(_ => {

View File

@ -193,7 +193,8 @@ export default class Star {
} }
if (ev.target.tagName === 'WC-ICON') { if (ev.target.tagName === 'WC-ICON') {
this.props.value = tmp.i + tmp.f this.props.value = tmp.i + tmp.f
this.dispatchEvent(new CustomEvent('input')) $.fire(this, 'input', { value: this.value })
$.fire(this, 'change', { value: this.value })
} }
}) })

View File

@ -3,7 +3,7 @@
<label> <label>
<span class="dot"></span> <span class="dot"></span>
</label> </label>
<slot></slot> <slot />
</section> </section>
</template> </template>
@ -11,13 +11,15 @@
:host { :host {
display: inline-flex; display: inline-flex;
align-items: center; align-items: center;
height: 32px;
color: var(--color-dark-1);
section { section {
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
line-height: 1;
white-space: nowrap; white-space: nowrap;
user-select: none;
} }
label { label {
display: flex; display: flex;
@ -28,6 +30,7 @@
margin: 5px; margin: 5px;
border-radius: 21px; border-radius: 21px;
background: var(--color-plain-3); background: var(--color-plain-3);
transition: background 0.2s linear;
cursor: inherit; cursor: inherit;
&.checked { &.checked {
@ -182,7 +185,8 @@ export default class Switch {
this.checked = !this.checked this.checked = !this.checked
this._updateStat() this._updateStat()
this.dispatchEvent(new CustomEvent('input')) $.fire(this, 'input')
$.fire(this, 'change')
}) })
} }

View File

@ -234,7 +234,7 @@ export default class Textarea {
} }
this.stamp = now this.stamp = now
this.dispatchEvent(new CustomEvent('submit', { detail: this.value })) $.fire(this, 'submit', { value: this.value })
} }
}) })
@ -244,6 +244,7 @@ export default class Textarea {
maxlength = maxlength || '∞' maxlength = maxlength || '∞'
this.__STAT__.textContent = `${len}/${maxlength}` this.__STAT__.textContent = `${len}/${maxlength}`
$.fire(this, ev.type, { value: this.value })
}) })
} }