(fix)修复 radio-group 中的选中值故障

This commit is contained in:
wangchangqi 2022-11-28 20:47:05 +08:00
parent 6158dc3e63
commit f09e0ab216
2 changed files with 21 additions and 18 deletions

View File

@ -15,17 +15,17 @@
│ │ ┌─────────┐ ┌───────┬────────┐ / │ \ │ Button(text),Switch, ││ │
│ │ │ │ │ Label │ Square │ / │ \│ Selector(Value/Date/Time)││ │
│ │ │(App)Icon│ ├───────┴────────┤/ │ │ ... ││ │
│ STAR │ │ │ │ Description |\ │ └──────────────────────────┘│ │
│ STAR │ │ │ │ Description \ │ └──────────────────────────┘│ │
│ LI │ └─────────┘ └────────────────┘ \ └───────────────────────────────┘ │
│ │ \ ┌──────────────────────────────────┐ │
│ │ \│ EMBED ┌───────────────┐│ │
│ │ │ │ SLOT ││ │
│ │ │ ├───────────────┤│ │
│ │ │┌─────────┐ │ Button(info) ││ │
│ │ ││ │ │ Checkbox |│ │
│ │ ││SplitLine│------| Input ││ │
│ │ ││ │ | RadioGroup ││ │
│ │ │└─────────┘ | Switch ││ │
│ │ ││ │ │ Checkbox │ │
│ │ ││SplitLine│------ Input ││ │
│ │ ││ │ RadioGroup ││ │
│ │ │└─────────┘ Switch ││ │
│ │ │ └───────────────┘│ │
│ │ └──────────────────────────────────┘ │
│ │ ┌──────────────────────────────────┐ │
@ -89,14 +89,14 @@
│ │ ┌─────────┐ ┌───────┬────────┐ ┌───────┐ ┌──────────┐ │
<star-li> │ │ │ │ Label │ Square │ │ │ │ (mock) │ │
│ │ │(App)Icon│ ├───────┴────────┤ │ VALUE │ │ Checkbox │ │
│type='checkbox'│ │ │ │ Description | │ │ │ │ │
│type='checkbox'│ │ │ │ Description │ │ │ │ │
│ pos='right' │ └─────────┘ └────────────────┘ └───────┘ └──────────┘ │
└───────────────┴───────────────────────────────────────────────────────┘
┌───────────────┬───────────────────────────────────────────────────────┐
│ │ ┌──────────┐ ┌─────────┐ ┌───────┬────────┐ ┌───────┐ │
<star-li> │ │ (mock) │ │ │ │ Label │ Square │ │ │ │
│ │ │ Checkbox │ │(App)Icon│ ├───────┴────────┤ │ VALUE │ │
│type='checkbox'│ │ │ │ │ │ Description | │ │ │
│type='checkbox'│ │ │ │ │ │ Description │ │ │
│ pos='left' │ └──────────┘ └─────────┘ └────────────────┘ └───────┘ │
└───────────────┴───────────────────────────────────────────────────────┘
```
@ -119,7 +119,7 @@
│ │ ┌─────────┐ ┌───────┬────────┐ ┌───────┐ ┌────────┐ │
<star-li> │ │ │ │ Label │ Square │ │ │ │ │ │
│ │ │(App)Icon│ ├───────┴────────┤ │ VALUE │ │ Switch │ │
│type='switch'│ │ │ │ Description | │ │ │ │ │
│type='switch'│ │ │ │ Description │ │ │ │ │
│ │ └─────────┘ └────────────────┘ └───────┘ └────────┘ │
└─────────────┴─────────────────────────────────────────────────────┘
```
@ -133,7 +133,7 @@
│ │ ┌─────────┐ ┌───────┬────────┐ ┌────────────────┐ │
<star-li> │ │ │ │ Label │ Square │ │ Radio(mock) │ │
│ │ │(App)Icon│ ├───────┴────────┤ │ │ │
│type='radio'│ │ │ │ Description | │circle/checkmark│ │
│type='radio'│ │ │ │ Description │circle/checkmark│ │
│ │ └─────────┘ └────────────────┘ └────────────────┘ │
└────────────┴───────────────────────────────────────────────────┘
```
@ -157,7 +157,7 @@
│ │ ┌─────────┐ ┌───────┬────────┐ ┌─────────┐ ┌────────┐┌────────┐ │
<star-li> │ │ │ │ Label │ Square │ │ │ │ ││ │ │
│ │ │(App)Icon│ ├───────┴────────┤ │SplitLine│ │Checkbox││Checkbox│ │
│ type= │ │ │ │ Description | │ │ │ ││ │ ... │
│ type= │ │ │ │ Description │ │ │ ││ │ ... │
│'embed-checkbox'│ └─────────┘ └────────────────┘ └─────────┘ └────────┘└────────┘ │
└────────────────┴─────────────────────────────────────────────────────────────────────┘
```
@ -180,7 +180,7 @@
│ │ ┌─────────┐ ┌───────┬────────┐ ┌─────────┐ ┌────────┐ │
<star-li> │ │ │ │ Label │ Square │ │ │ │ (SLOT) │ │
│ │ │(App)Icon│ ├───────┴────────┤ │SplitLine│ │ Switch │ │
│ type= │ │ │ │ Description | │ │ │ │ │
│ type= │ │ │ │ Description │ │ │ │ │
│'embed-switch'│ └─────────┘ └────────────────┘ └─────────┘ └────────┘ │
└──────────────┴───────────────────────────────────────────────────────┘
```
@ -191,9 +191,9 @@
```
----------------
| 主Label |
│ 主Label │
----------------
| 次Description |
│ 次Description │
-----------------
```
@ -243,14 +243,14 @@
│ │ │ ┌─────────┐ ┌───────┬────────┐ ┌────────────────┐ │ │
│ │ <star-li> │ │ │ │ Label │ Square │ │ Radio(mock) │ │ │
│ │ │ │(App)Icon│ ├───────┴────────┤ │ │ │ │
│ │type='radio'│ │ │ │ Description | │circle/checkmark│ │ │
│ │type='radio'│ │ │ │ Description │circle/checkmark│ │ │
│ │ │ └─────────┘ └────────────────┘ └────────────────┘ │ │
│ └────────────┴───────────────────────────────────────────────────┘ │
│ ┌────────────┬───────────────────────────────────────────────────┐ │
│ │ │ ┌─────────┐ ┌───────┬────────┐ ┌────────────────┐ │ │
│ │ <star-li> │ │ │ │ Label │ Square │ │ Radio(mock) │ │ │
│ │ │ │(App)Icon│ ├───────┴────────┤ │ │ │ │
│ │type='radio'│ │ │ │ Description | │circle/checkmark│ │ │
│ │type='radio'│ │ │ │ Description │circle/checkmark│ │ │
│ │ │ └─────────┘ └────────────────┘ └────────────────┘ │ │
│ └────────────┴───────────────────────────────────────────────────┘ │
│ ... │
@ -288,7 +288,7 @@
│ │ ┌─────────┐ ┌───────┬────────┐ ┌───────────────┐ │
<star-li> │ │ │ │ Label │ Square │ │ │ │
│ │ │(App)Icon│ ├───────┴────────┤ │ Select │ │
│type='selector'│ │ │ │ Description | │Single/Multiple│ │
│type='selector'│ │ │ │ Description │Single/Multiple│ │
│ │ └─────────┘ └────────────────┘ └───────────────┘ │
└───────────────┴──────────────────────────────────────────────────┘
```
@ -336,7 +336,7 @@
```
┌──────────────────────────────────────────────────────────────────────┐
<star-li type='base'> |
<star-li type='base'>
│ ┌───────────┬────────────────────┐┌───────────┬────────────────────┐ │
│ │ │ ┌────────────────┐ ││ │ ┌────────────────┐ │ │
│ │ │ │ Image │ ││ │ │ Image │ │ │

View File

@ -5,7 +5,7 @@ import {
property,
CSSResultArray,
StarBaseElement,
} from '@star-web-components/base/star-base-element.js'
} from '@star-web-components/base'
import {StarRadio, RadioVariant} from './radio.js'
import {sharedStyles} from './radio-style.js'
@ -113,6 +113,7 @@ export class StarRadioGroup extends StarBaseElement {
radio.checked = false
}
}
this.selected = target.value
this.emit('change')
}
}
@ -121,6 +122,7 @@ export class StarRadioGroup extends StarBaseElement {
const target = evt.target as StarRadio
if (this.radios.indexOf(target) !== -1) {
target.checked = !target.checked
this.selected = this.getSelected()
this.emit('change')
}
}
@ -143,6 +145,7 @@ export class StarRadioGroup extends StarBaseElement {
radio.checkedLocation = this.checkedLocation
radio.checkedType = this.checkedType
}
this.selected = this.getSelected()
}
}