gpt4 book ai didi

javascript - 将 Material UI 的 TouchRipple 组件应用于自定义元素/组件

转载 作者:行者123 更新时间:2023-11-29 21:15:39 24 4
gpt4 key购买 nike

我的 material-ui 应用程序中有一个列表,其中包含列和(图标)按钮。

当单击列表中的项目时,我希望受到 Material Design 的涟漪影响。

Material UI 的列表在单击时确实带有链式 react ,不幸的是因为我使用的是自定义列表(因为我需要有多个列和许多其他自定义)我没有链式 react (我我只是使用 div 来创建我的列表)。

我知道 Material UI 有一个组件 TouchRipple,它用于所有具有波纹效果的组件(您可以在 internal 目录中找到它)我尝试包装我的自定义列表项目放入 TouchRipple 组件中,但不幸的是,动画显示在页面顶部,与实际列表项目的位置和大小没有任何关系,基本上它不能正常工作。

我的问题是,我可以吗?如果可以,我该如何在我的自定义组件上使用 TouchRipple 组件来为它们添加涟漪效果?

最佳答案

我想出了如何让它发挥作用。

只需将样式 transform: translate(0px, 0px); 添加到 TouchRipple 生成的父 div 中,就可以在正确的位置和大小产生波纹。

关于javascript - 将 Material UI 的 TouchRipple 组件应用于自定义元素/组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/39519683/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com