Skip to content

Commit 20a56cf

Browse files
miaodongqing陌缓
andauthored
chore(Selector): fix value dosen't work (#127)
* chore(Selector): fix value dosen't work * chore(Selector): removew export getFixedVlaue Co-authored-by: 陌缓 <[email protected]>
1 parent 4d9dabb commit 20a56cf

File tree

6 files changed

+46
-42
lines changed

6 files changed

+46
-42
lines changed

demo/pages/Selector/index.axml

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<selector
22
title="单选"
3-
value="1"
3+
value="11"
44
items="{{items1}}"/>
55

66
<selector
@@ -40,7 +40,7 @@
4040
inline="{{true}}"
4141
inlineSize="larger"
4242
onTap="handleChangeValue"
43-
data-value="3">
43+
data-value="11">
4444
改变选中值为: 3
4545
</button>
4646
</view>

demo/pages/Selector/index.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@ Page({
33
items1: [
44
{ text: '选项一', value: '1' },
55
{ text: '选项二', value: '2' },
6-
{ text: '选项三', value: '3' }],
6+
{ text: '选项三', value: '11' }],
77
items2: [
88
{ text: '选项一', subText: '副标题一', value: '1' },
99
{ text: '选项二', subText: '副标题二', value: '2' },

src/Selector/index.axml

Lines changed: 0 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,6 @@
2020
<view
2121
class="amd-selector-item {{item.disabled ? 'amd-selector-item-disabled' : ''}} {{selector.getIsCurItemSelected(cValue, multiple, item.value) ? 'amd-selector-item-active' :''}}"
2222
data-value="{{item.value}}"
23-
data-text="{{item.text}}"
2423
data-disabled="{{item.disabled}}"
2524
onTap="onChange">
2625
<view class="amd-selector-item-text"

src/Selector/index.md

Lines changed: 23 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -17,15 +17,22 @@ toc: false
1717
## 代码示例
1818
### 基本使用
1919
<code src='../../demo/pages/Selector'></code>
20+
## 属性
2021

22+
```typescript
23+
type SelectorItem = {
24+
text: string;
25+
value: string|number;
26+
subText?: srting;
27+
disabled?: boolean;
28+
}
29+
```
30+
<hr />
2131
22-
23-
## 属性
2432
| 属性 | 类型 | 必填 | 默认值 | 说明 |
2533
| -----|-----|-----|-----|----- |
26-
| controlled | boolean || false | 是否受控 |
27-
| value | string[] || - | 已选择项, 取 items 每一项的 value |
28-
| items | {text:string; value:string; subText: string; disabled: boolean}[] || - | 可选项 |
34+
| value | string &#124; number &#124; string[] &#124; number[] | 否 | - | 已选择项, 取 items 每一项的 value |
35+
| items | SelectorItem[] | 是 | - | 可选项 |
2936
| activeItemClassName | string | 否 | - | 每一项激活时新加类名 |
3037
| multiple | boolean | 否 | false | 是否允许多选,标签栏显示的时候会显示当前单选/多选的状态 |
3138
| title | string | 否 | '' | 标签栏标题 |
@@ -39,7 +46,7 @@ toc: false
3946
## 事件
4047
| 事件名 | 说明 | 类型 |
4148
| -----|-----|-----|
42-
| onChange | 选中值发生变化,触发回调 | (v: string &#124; string[]) => void |
49+
| onChange | 选中值发生变化,触发回调 | (v: string &#124; string[], selectedItem: SelectItem &#124; SelectItem[] ) => void |
4350
4451
## 样式类
4552
| 类名 | 说明 |
@@ -55,14 +62,14 @@ toc: false
5562
| amd-selector-item-badge-active | 激活状态下徽标样式 |
5663
5764
<style>
58-
table th:first-of-type { width: 180px; }
59-
.__dumi-default-layout-content article table:first-of-type th:nth-of-type(2) {
60-
width: 140px
61-
}
62-
.__dumi-default-layout-content article table:first-of-type th:nth-of-type(3) {
63-
width: 30px
64-
}
65-
.__dumi-default-layout-content article table:first-of-type th:nth-of-type(4) {
66-
width: 50px
67-
}
65+
table th:first-of-type { width: 180px; }
66+
.__dumi-default-layout-content article table:first-of-type th:nth-of-type(2) {
67+
width: 140px;
68+
}
69+
.__dumi-default-layout-content article table:first-of-type th:nth-of-type(3) {
70+
width: 30px;
71+
}
72+
.__dumi-default-layout-content article table:first-of-type th:nth-of-type(4) {
73+
width: 50px;
74+
}
6875
</style>

src/Selector/index.sjs

Lines changed: 8 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,13 @@
11
const getFixedValue = (value, multiple) => {
2-
let fixedValue;
3-
if (multiple) {
4-
fixedValue = value;
5-
} else {
6-
fixedValue = value && value.slice(0, 1);
2+
let fixedValue = [];
3+
if (value === null) {
4+
fixedValue = []
5+
} else if (multiple && value.constructor === 'Array') {
6+
fixedValue = value
7+
} else if (!(value.constructor === 'Array')) {
8+
fixedValue = [value]
79
}
8-
9-
if (fixedValue) {
10-
return fixedValue;
11-
}
12-
13-
// 如果不是数组, 返回数组兜底
14-
return [];
10+
return fixedValue;
1511
};
1612

1713
const getIsCurItemSelected = (value, multiple, itemValue) => {

src/Selector/index.ts

Lines changed: 12 additions & 10 deletions
Original file line numberDiff line numberDiff line change
@@ -3,13 +3,14 @@ import controlled from '../mixins/controlled';
33
import formMixin from '../mixins/form';
44

55
const getFixedValue = (value, multiple) => {
6-
let fixedValue;
7-
if (multiple) {
8-
fixedValue = value;
9-
} else {
10-
fixedValue = value?.slice(0, 1);
6+
let fixedValue = [];
7+
if (value === null) {
8+
fixedValue = []
9+
} else if (multiple && Array.isArray(value)) {
10+
fixedValue = value
11+
} else if (!Array.isArray(value)) {
12+
fixedValue = [value]
1113
}
12-
1314
return fixedValue;
1415
};
1516

@@ -18,11 +19,10 @@ Component({
1819
props: SelectorDefaultProps,
1920
data: {} as {
2021
cValue?: string[];
21-
items: [];
2222
},
2323
methods: {
2424
onChange(e) {
25-
const { disabled, value, text } = e.currentTarget.dataset;
25+
const { disabled, value } = e.currentTarget.dataset;
2626
const { multiple, items } = this.props;
2727
if (!disabled && !this.props.disabled) {
2828
let nextValue: string[];
@@ -42,7 +42,8 @@ Component({
4242
return items.map((item) => item.value).filter((item) => v.indexOf(item) !== -1);
4343
};
4444
nextValue = sortValue(nextValue);
45-
this.cOnChange(nextValue);
45+
const selectedItems = nextValue.map(v => items.filter(item => item.value === v)?.[0])
46+
this.cOnChange(nextValue, selectedItems);
4647
} else {
4748
// 单选
4849
// 取消选中
@@ -53,7 +54,8 @@ Component({
5354
// 选中
5455
nextValue = value;
5556
}
56-
this.cOnChange(nextValue, text);
57+
const selectedItem = items.filter(item => item.value === nextValue)?.[0] || null
58+
this.cOnChange(nextValue, selectedItem);
5759
}
5860
}
5961
},

0 commit comments

Comments
 (0)