update

src/assets/styles/prosemirror.scss

@@ -2,7 +2,7 @@
   outline: 0;
   border: 0;
   font-size: 16px;
-  white-space: pre-wrap;
+  white-space: normal;
   &:not(.ProseMirror-static) {
     user-select: text;
   }

src/utils/prosemirror/schema/nodes.ts

@@ -101,11 +101,10 @@ const listItem: NodeSpec = {
   group: 'block',
 }
 */
-
 const listItem: NodeSpec = {
   attrs: {
-    textAlign: { default: '' },      // 对应 CSS text-align
-    textAlignLast: { default: '' },  // 对应 CSS text-align-last
+    textAlign: { default: '' },
+    textAlignLast: { default: '' },
     textIndent: { default: '' },
     marginTop: { default: '' },
     marginBottom: { default: '' },
@@ -116,6 +115,7 @@ const listItem: NodeSpec = {
     paddingRight: { default: '' },
     paddingBottom: { default: '' },
     paddingLeft: { default: '' },
+    whiteSpace: { default: 'normal' }, // 新增 white-space 属性
   },
   content: 'paragraph block*',
   group: 'block',
@@ -138,6 +138,7 @@ const listItem: NodeSpec = {
         const paddingRight = style.paddingRight || '';
         const paddingBottom = style.paddingBottom || '';
         const paddingLeft = style.paddingLeft || '';
+        const whiteSpace = style.whiteSpace || 'normal'; // 读取 white-space
 
         return {
           textAlign,
@@ -152,6 +153,7 @@ const listItem: NodeSpec = {
           paddingRight,
           paddingBottom,
           paddingLeft,
+          whiteSpace, // 返回 whiteSpace
         };
       },
     },
@@ -170,6 +172,7 @@ const listItem: NodeSpec = {
       paddingRight,
       paddingBottom,
       paddingLeft,
+      whiteSpace, // 获取 whiteSpace
     } = node.attrs;
 
     let style = '';
@@ -192,6 +195,9 @@ const listItem: NodeSpec = {
     if (paddingRight) style += `padding-right: ${paddingRight};`;
     if (paddingBottom) style += `padding-bottom: ${paddingBottom};`;
     if (paddingLeft) style += `padding-left: ${paddingLeft};`;
+    if (whiteSpace && whiteSpace !== 'normal') {
+      style += `white-space: ${whiteSpace};`; // 添加 white-space
+    }
 
     const attrs: { style?: string } = {};
     if (style) attrs.style = style;
@@ -200,12 +206,11 @@ const listItem: NodeSpec = {
   },
 };
 
-
 const paragraph: NodeSpec = {
-  whitespace: "pre",
+  whitespace: "pre", // 此属性控制 ProseMirror 内部空格处理，与 CSS white-space 无关，保留不变
   attrs: {
-    textAlign: { default: '' },      // 对应 CSS text-align
-    textAlignLast: { default: '' },  // 对应 CSS text-align-last
+    textAlign: { default: '' },
+    textAlignLast: { default: '' },
     indent: { default: 0 },
     textIndent: { default: 0 },
     marginTop: { default: '' },
@@ -217,6 +222,7 @@ const paragraph: NodeSpec = {
     paddingRight: { default: '' },
     paddingBottom: { default: '' },
     paddingLeft: { default: '' },
+    whiteSpace: { default: 'normal' }, // 新增 white-space 属性
   },
   content: 'inline*',
   group: 'block',
@@ -239,6 +245,7 @@ const paragraph: NodeSpec = {
         const paddingRight = style.paddingRight || '';
         const paddingBottom = style.paddingBottom || '';
         const paddingLeft = style.paddingLeft || '';
+        const whiteSpace = style.whiteSpace || 'normal'; // 读取 white-space
 
         return {
           textAlign,
@@ -253,6 +260,7 @@ const paragraph: NodeSpec = {
           paddingRight,
           paddingBottom,
           paddingLeft,
+          whiteSpace, // 返回 whiteSpace
         };
       },
     },
@@ -279,6 +287,7 @@ const paragraph: NodeSpec = {
       paddingRight,
       paddingBottom,
       paddingLeft,
+      whiteSpace, // 获取 whiteSpace
     } = node.attrs;
 
     let style = '';
@@ -301,6 +310,9 @@ const paragraph: NodeSpec = {
     if (paddingRight) style += `padding-right: ${paddingRight};`;
     if (paddingBottom) style += `padding-bottom: ${paddingBottom};`;
     if (paddingLeft) style += `padding-left: ${paddingLeft};`;
+    if (whiteSpace && whiteSpace !== 'normal') {
+      style += `white-space: ${whiteSpace};`; // 添加 white-space
+    }
 
     const attr: Attr = { style };
     return ['p', attr, 0];
@@ -317,7 +329,6 @@ const hardBreak: NodeSpec = {
   },
 };
 
-
 const {
   doc,
   blockquote,

src/views/components/element/ShapeElement/BaseShapeElement.vue

@@ -144,7 +144,7 @@ const text = computed<ShapeText>(() => {
   padding: 5px;
   word-break: break-word;
   pointer-events: none;
-  white-space: pre-wrap;
+  white-space: normal;
   &.editable {
     pointer-events: all;
   }

src/views/components/element/ShapeElement/index.vue

@@ -266,7 +266,7 @@ const startEdit = () => {
   padding: 5px;
   word-break: break-word;
   pointer-events: none;
-  white-space: pre-wrap;
+  white-space: normal;
 
   &.editable {
     pointer-events: all;

src/views/components/element/TextElement/BaseTextElement.vue

@@ -101,7 +101,7 @@ const { shadowStyle } = useElementShadow(shadow)
   flex-direction: column;
   word-break: break-word;
   pointer-events: none;
-  white-space: pre-wrap;
+  white-space: normal;
   &.editable {
     pointer-events: all;
   }

src/views/components/element/TextElement/index.vue

@@ -233,7 +233,7 @@ watch(isHandleElement, () => {
   flex-direction: column;
   word-break: break-word;
   pointer-events: none;
-  white-space: pre-wrap;
+  white-space: normal;
   &.editable {
     pointer-events: all;
   }