react，引入antd mobile的List和Picker，点击List后没有弹出Picker的内容？

在使用的react版本如下：

// 户型数据
const roomTypeData = [
  { label: '一室', value: 'ROOM|jdfxur3484fd' },
  { label: '二室', value: 'ROOM|rudjur4846fd' }
]

const RentAdd = () => {
    const [value, setValue] = useState('')
    const [visible, setVisible] = useState(false)
    const [roomType,setRoomType] = useState('')

useEffect(()=>{
  setVisible(true)
},[])

// 获取表单数据
  const getValue = (name, value) => {
    setCommunity([name] = value)
  }

return (
<List>
  <List.Item
            extra='请选择'
            arrow={true}
            onClick={() => {
              <Picker
                columns={roomTypeData}
                visible={visible}
                value={[roomType]}
                mouseWheel={true}
                // onChange={val => {setValue(setRoomType(getValue('roomType', val[0])))}}
                onClose={() => {setVisible(false)}}
                onConfirm={v => {setValue(v)}}
              />
            }}
          >
            户&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;型
    </List.Item>
</List>

)

}

目前效果是，点击以下列表时，列表的背景颜色变成深灰色，然而没有弹出弹窗，chrome浏览器没有报错，审查元素里也看不到与Picker弹窗相关的标签