主页 / user-16476466

KostyanWest's questions

Martin Hope
KostyanWest
Asked: 2023-11-17 04:24:42 +0800 CST
  • 5

我使用一个Select组件（假设是这个）。默认情况下，Popover组件出现在选择字段的正下方，但我想将其放置在右侧。我将在下面描述我尝试实现此行为的方法以及每次都失败的原因。请记住，我是 MUI 的新手。

  1. 改变位置的最正确方法是设置anchorOrigin和transformOrigin道具，但只有当你可以访问这些道具时它才有效。该组件自行Select创建（或更准确地说，是内部的组件）并且不提供 API 来传播 props。PopoverMenuSelect

  2. 该Menu组件有一个传播到 的PopoverClassesprop ，因此我想通过覆盖JS 计算的值和样式来更改位置。但无论我多么努力地试图弄清楚它是如何工作的，我都无法做到。我发现的每个指南都使用了自 MUI v5 以来已弃用的from或from 。MUI v5 中 prop是否已完全弃用？classesPopoverlefttopmakeStyles"@mui/styles"createUseStyles"react-jss"classes

  3. 添加类似 或 之类的样式"& .MuiPopover-root"也Select不起作用Menu，因为PopoverDOM 顶部附近的创建可以用作模式对话框，并且不是Select.

  4. 尽管Menu不会直接将 props 传播到Popover，但它会将 props 传播到MenuList的子级a Popover。使用MenuListProps: {ref=myRef}我可以访问Popoverby的 DOM 元素myRef.current.parentElement。但这还不够，因为我没有好的事件来覆盖值。是在的事件触发Popover后短时间内创建的，因此在事件期间，值是未定义的，之后就太晚了 - 明显是如何跳跃的。onOpenSelectmyRef.currentsetTimeout()Popover

这么简单的动作却太难了。我错过了一些明显的事情吗？

material-ui