这是关于KendoReact下拉菜单
https://www.telerik.com/kendo-react-ui/components/dropdowns/
如何增加“k-item”的宽度以匹配内容的宽度,并且当涉及到长文本内容时停止文本换行?同时,当涉及到短文本内容时,如何保持“k-item”的宽度为“下拉列表(k-list)”的宽度?
我有两个下拉列表,分别包含长列表项和短列表项,但添加到我的项目时的外观。
因此,我为“k-list”弹出窗口设置添加了“width:auto”,但发生了这种情况。
但我需要的是这样的
我需要你的帮助,使它看起来像上面的图像。
2条答案
按热度按时间xuo3flqw1#
下拉列表中有一个popupSettings属性,如果你不点击它,项目将与框的宽度匹配。如果你想让项目比框长或短,你可以设置一个宽度。下面是一个例子:
popupSettings={{ width: "250px" }}
ukxgm1gy2#
差不多3年后,我刚刚面临完全相同的问题,因为在这个问题LOL。以下是我如何解决它:
1.在index.html中,在body元素下添加一个div,如下所示,这将是DropDownLists弹出窗口的容器:
1.将以下属性添加到DropDownList组件。
这里有几点注意事项:
1.然后将其设置为弹出窗口的最小宽度,这样它就永远不会缩小到下拉菜单的触发器元素的宽度以下
1.最后,我将弹出窗口的宽度设置为“auto”,这样它就可以随着更宽的下拉选项而增长。
1.切勿在下拉列表的弹出设置中设置宽度,否则上述解决方案将无效!