Picker在React的Form中死循环

[TuringZhu]

NutUI React 包名

@nutui/nutui-react

NutUI React 版本号

2.6.14

平台

h5, weapp

重现链接

https://codesandbox.io/p/devbox/dawn-tree-6s2z45

重现步骤

示例代码

import {View} from "@tarojs/components";
import "./index.scss"
import {Cell, Form, Picker, PickerOption} from "@nutui/nutui-react-taro";
import {useState} from "react";
function Index() {
 const  [visible,setVisible] = useState(false);
 const [value,setValue] = useState(0);
  return(
    <View>
      <Form initialValues={{value:1}}>
        <Cell
        title={"title"}
          extra={<div>
          <span onClick={()=>setVisible(true)}>
            {value===1?"111":"222"}
          </span>
            <Form.Item name={"value"} initialValue={1}>
          <Picker
            visible={visible}
            defaultValue={[1]}
            onConfirm={(list:PickerOption[],values:(string|number)[])=>{
              console.log(list,values)
              setVisible(false)
              setValue(values[0] as  number)
            }}
            onCancel={()=>setVisible(false)}
            options={[
            {value:1,text:"11"},
            {value:2,text:"21"}
          ]}
          />
            </Form.Item>
        </div>}/>

      </Form>
    </View>
  )
}

export default Index


### 期望的结果是什么？

没有死循环，不报错

### 实际的结果是什么？

<img width="1274" alt="image" src="https://github.com/user-attachments/assets/66ed5244-7eb1-43cb-a8ad-11b5a8c2a66c">


### 环境信息

> taro info

$ ./node_modules/.bin/taro info
👽 Taro v4.0.6

Taro CLI 4.0.6 environment info:
System:
OS: macOS 12.7.6
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 20.17.0 - /usr/local/apps/bin/node
Yarn: 1.23.0-20200928.1349 - /usr/local/apps/bin/yarn
npm: 10.8.3 - /usr/local/apps/bin/npm
npmPackages:
@tarojs/cli: 4.0.6 => 4.0.6
@tarojs/components: 4.0.6 => 4.0.6
@tarojs/helper: 4.0.6 => 4.0.6
@tarojs/plugin-framework-react: 4.0.6 => 4.0.6
@tarojs/plugin-html: 4.0.6 => 4.0.6
@tarojs/plugin-platform-alipay: 4.0.6 => 4.0.6
@tarojs/plugin-platform-h5: 4.0.6 => 4.0.6
@tarojs/plugin-platform-jd: 4.0.6 => 4.0.6
@tarojs/plugin-platform-qq: 4.0.6 => 4.0.6
@tarojs/plugin-platform-swan: 4.0.6 => 4.0.6
@tarojs/plugin-platform-tt: 4.0.6 => 4.0.6
@tarojs/plugin-platform-weapp: 4.0.6 => 4.0.6
@tarojs/react: 4.0.6 => 4.0.6
@tarojs/runtime: 4.0.6 => 4.0.6
@tarojs/shared: 4.0.6 => 4.0.6
@tarojs/taro: 4.0.6 => 4.0.6
@tarojs/taro-loader: 4.0.6 => 4.0.6
@tarojs/webpack5-runner: 4.0.6 => 4.0.6
babel-preset-taro: 4.0.6 => 4.0.6
eslint-config-taro: 4.0.6 => 4.0.6
react: ^18.0.0 => 18.3.1

### 其他补充信息

_No response_

[oasis-cloud]

picker用法参考文档：https://nutui.jd.com/taro/react/2x/#/zh-CN/component/form

<Form.Item
          label="Picker"
          name="picker"
          trigger="onConfirm"
          getValueFromEvent={(...args) => args[1]}
          onClick={(event, ref: any) => {
            ref.open()
          }}
        >
          <Picker options={[pickerOptions]}>
            {(value: any) => {
              return (
                <Cell
                  style={{
                    padding: 0,
                    '--nutui-cell-divider-border-bottom': '0',
                  }}
                  className="nutui-cell--clickable"
                  title={
                    value.length
                      ? pickerOptions.filter((po) => po.value === value[0])[0]
                          ?.text
                      : 'Please select'
                  }
                  extra={<ArrowRight />}
                  align="center"
                />
              )
            }}
          </Picker>
        </Form.Item>