diff --git a/src/playground/editor/advanced-editor/example/xml/dnd5e.xml b/src/playground/editor/advanced-editor/example/xml/dnd5e.xml
index 961c2115b..3140506a3 100644
--- a/src/playground/editor/advanced-editor/example/xml/dnd5e.xml
+++ b/src/playground/editor/advanced-editor/example/xml/dnd5e.xml
@@ -392,7 +392,7 @@
-
+
diff --git a/src/shared/components/layout/context/LayoutStateContext.tsx b/src/shared/components/layout/context/LayoutStateContext.tsx
index be0cb576d..73b5341c9 100644
--- a/src/shared/components/layout/context/LayoutStateContext.tsx
+++ b/src/shared/components/layout/context/LayoutStateContext.tsx
@@ -2,9 +2,9 @@ import React from 'react';
import { TMemo } from '@shared/components/TMemo';
import type { XMLBuilderContext } from '../XMLBuilder';
-export const LayoutStateContext = React.createContext(
- null
-);
+export const LayoutStateContext =
+ React.createContext(null);
+LayoutStateContext.displayName = 'LayoutStateContext';
export const LayoutStateContextProvider: React.FC<{
state: XMLBuilderContext;
diff --git a/src/shared/components/layout/context/LayoutWidthContext.tsx b/src/shared/components/layout/context/LayoutWidthContext.tsx
index d23ee6961..3c2f01f38 100644
--- a/src/shared/components/layout/context/LayoutWidthContext.tsx
+++ b/src/shared/components/layout/context/LayoutWidthContext.tsx
@@ -1,16 +1,17 @@
import React from 'react';
export const LayoutWidthContext = React.createContext(0);
+LayoutWidthContext.displayName = 'LayoutWidthContext';
interface LayoutWidthContextProviderProps {
width: number;
}
-export const LayoutWidthContextProvider: React.FC = React.memo(
- (props) => {
+export const LayoutWidthContextProvider: React.FC =
+ React.memo((props) => {
return (
{props.children}
);
- }
-);
+ });
+LayoutWidthContextProvider.displayName = 'LayoutWidthContextProvider';
diff --git a/src/shared/components/layout/tags/Button/shared.tsx b/src/shared/components/layout/tags/Button/shared.tsx
new file mode 100644
index 000000000..3976d2fa7
--- /dev/null
+++ b/src/shared/components/layout/tags/Button/shared.tsx
@@ -0,0 +1,32 @@
+import React, { useContext } from 'react';
+import type { TagComponent } from '../type';
+import { TMemo } from '@shared/components/TMemo';
+import { Button, ButtonProps } from 'antd';
+import { useLayoutChildren } from '../../hooks/useLayoutChildren';
+import { LayoutStateContext } from '../../context/LayoutStateContext';
+
+interface TagButtonSharedProps {
+ showInDetail: boolean;
+ type: ButtonProps['type'];
+ danger: ButtonProps['danger'];
+ onClick: ButtonProps['onClick'];
+}
+export const TagButtonShared: TagComponent = TMemo(
+ (props) => {
+ const { showInDetail = false } = props;
+ const children = useLayoutChildren(props);
+ const context = useContext(LayoutStateContext)!;
+
+ if (context.layoutType === 'detail' && showInDetail !== true) {
+ // 详情页不显示按钮(默认)
+ return null;
+ }
+
+ return (
+
+ );
+ }
+);
+TagButtonShared.displayName = 'TagButtonShared';
diff --git a/src/shared/components/layout/tags/__all__.ts b/src/shared/components/layout/tags/__all__.ts
index e49da6aa6..03c632baa 100644
--- a/src/shared/components/layout/tags/__all__.ts
+++ b/src/shared/components/layout/tags/__all__.ts
@@ -36,6 +36,7 @@ import { TagCustomListEdit } from './CustomList/edit';
import { TagCurrMaxEdit } from './CurrMax/edit';
import { TagCurrMaxDetail } from './CurrMax/detail';
import { TagSpaceShared } from './Space/shared';
+import { TagButtonShared } from './Button/shared';
// 展示数据组件
registerTag('Template', TagTemplateShared);
@@ -83,6 +84,8 @@ registerTag('RollBtn', TagRollBtnDetail, TagRollBtnEdit);
registerTag('CurrMax', TagCurrMaxDetail, TagCurrMaxEdit);
+registerTag('Button', TagButtonShared, TagButtonShared);
+
// 高级操作组件
registerTag('Use', TagUseShared);