Mantine 莫代尔未显示

Question

我使用 Vite 创建了一个 React 应用程序并安装了Mantine v6.0.0. 当我调用以下函数打开 Mantine 模态时，视图变暗，但模态不可见。

const openModal = () => modals.openConfirmModal({
    title: 'Please confirm your action',
    children: (
      <Text size="sm">
        This action is so important that you are required to confirm it with a modal. Please click
        one of these buttons to proceed.
      </Text>
    ),
    labels: { confirm: 'Confirm', cancel: 'Cancel' },
    onCancel: () => console.log('Cancel'),
    onConfirm: () => console.log('Confirmed'),
  });

Answer 1

事实证明，vite React 模板导入了一些默认样式（index.css），这导致模式无法正确显示。一旦我删除了包含以下 css 属性的 css 导入，模式就可以正常工作。

body {
  display: flex
}