jdf2e / nutui-react

京东风格的移动端 React 组件库 、支持多端小程序(A React UI Toolkit for Mobile Web)
https://nutui.jd.com/react/
920 stars 263 forks source link

Picker 组件 onConfirm 返回参数错误 #2349

Open zhangminggeek opened 5 months ago

zhangminggeek commented 5 months ago

NutUI React 包名

@nutui/nutui-react-taro

NutUI React 版本号

2.6.8

平台

weapp

重现链接

https://codesandbox.io/p/sandbox/nutui-react-2x-demo-fg4vxd?file=/src/App.tsx

重现步骤

<Picker
        options={data
          ?.filter((item) => {
            // 过滤掉已被选的选项
            const checkedSizeIdList = internalValue?.map(
              (field) => field.sizeId,
            );
            return !checkedSizeIdList.includes(item.id);
          })
          ?.map((item) => ({ text: item.name, value: item.id }))}
        onConfirm={(_, selectedValue: number[]) => {
          setInternalValue([
            ...internalValue,
            { sizeId: selectedValue[0], count: 0 },
          ]);
          setVisibleSizePicker(false);
        }}
        // 其他属性忽略
      />
  1. 第一次打开 Picker 时 option 为 [{text: '1', value: 1}, {text: '2', value: 2}, {text: '3', value: 3}]
  2. 选中第2项,点击确定,此时返回值正确
  3. 再次打开 Picker, 此时 option 变为 [{text: '1', value: 1}, {text: '2', value: 2}]
  4. 不滑动选项,点击确定,此时返回值为上一次选中项,返回值不正确

期望的结果是什么?

选项变化后再次打开弹框时的选中值应重置

实际的结果是什么?

选项变化后再次打开弹框时的选中值为上一次选中的值

环境信息

No response

其他补充信息

No response

xiaoyatong commented 4 months ago

从提供的代码逻辑来看,options 过滤掉了已选数据?

zhangminggeek commented 4 months ago

从提供的代码逻辑来看,options 过滤掉了已选数据?

是的,使用场景是,某个选项被选中后,再次打开选择器时不希望他再出现在可选项中