将Material UI的TouchRipple组件应用于自定义元素/组件
我的material-ui应用程序中有一个列表，其中包含列和(图标)按钮。
当列表中的一个项目被点击时，我想让材质设计产生连锁反应。
Material UI的列表在单击时会产生涟漪效应，不幸的是，因为我使用的是自定义列表(因为我需要多个列和许多其他定制)，所以我没有涟漪效应(我只是使用div来创建我的列表)。
我知道Material UI有一个组件TouchRipple，它用在所有有连锁反应的组件中(你可以在internal目录中找到它)我试着把我的自定义列表项包装到一个TouchRipple组件中，但不幸的是，动画显示在页面的顶部，与实际列表项的位置和大小没有任何关系，基本上它不能正常工作。
我的问题是，我可以吗?如果可以，我如何在自定义组件上使用TouchRipple组件来为它们添加涟漪效果？
回答 2
Stack Overflow用户
发布于 2016-09-16 05:19:32
我想出了怎么让它工作。
只需将样式transform: translate(0px, 0px);添加到由TouchRipple生成的父div中，就可以在正确的位置和大小产生波动。
Stack Overflow用户
发布于 2018-10-25 21:37:13
您可以通过用<ButtonBase>组件包装您的自定义组件来实现这一点。有关示例，请参阅ButtonBase API page中的“复杂按钮”部分。
https://stackoverflow.com/questions/39519683
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号