时间戳

首页 > 解决方案 > antd中如何动态更新模态对话框的footer类的属性

javascript - antd中如何动态更新模态对话框的footer类的属性

问题描述

antd 定义的类名是.ant-modal-footer，在我的 css 中，我有类似下面的内容。我想要的是能够position通过代码动态更改属性。我正在使用反应。

有一个bodyStyle属性，我可以动态更新它，但我看不到页脚。

有任何想法吗？

.ant-modal-footer {
    padding: 14px 30px 30px;
    background: #f0f4f9;

    @media (max-width: 568px) {
      position: fixed;
      width: 100vw;
      overflow: hidden;
      bottom: 0;
    }
  }

标签： javascriptreactjsantd

解决方案

我认为您始终可以使用 modal 的类名来选择和更改页脚样式。

就像是：

.my-modal-class .ant-modal-footer{
  background: red;
}

接着

<Modal className="my-modal-class" />

它应该选择和修改页脚。

还有wrapClassName道具

示例：https ://codesandbox.io/s/z3jlokmjyl

注意：在示例中，我展示了如何更改整个页脚节点，如果它只是放置您想要更改的内容，页脚是一个 ReactNode，您应该能够操纵位置

推荐阅读