refactor: poetry content to array

src/components/ColorTitle/Poetry.js

@@ -35,7 +35,7 @@ const Poetry = ({ content = '', author = '', title = '' }) => {
       <h2>
         {author} ·《 {title} 》
       </h2>
-      <p className="line">「{content.replace(/[，|。|！|？|、]/g, ' ').trim()}」</p>
+      <p className="line">「{content.join(' ')}」</p>
     </Wrapper>
   );
 };

src/components/Preview.js

@@ -105,14 +105,11 @@ const Preview = ({ name, color, figure = 'default.png?width=8rem', closePreview
   const figureO = +(params.get('o') || 1);
   const currPoetry = JSON.parse(localStorage.getItem('POETRY'));
   const { author, title, content } = currPoetry;
-  const lines = content
-    .replace(/[，|。|！|？]/g, ' ')
-    .trim()
-    .split(' ');
+
   return (
     <Wrapper id="PREVIEW" bgColor={color}>
       <article style={{ color: oppositeColor }} className={'poetry'}>
-        {lines.map(line => {
+        {content.map(line => {
           return (
             <p key={line} className="line">
               {line}

src/hooks.js

@@ -86,6 +86,10 @@ const usePoetry = dep => {
           author: result.data.origin.author,
           title: result.data.origin.title
         };
+        obj.content = obj.content
+          .replace(/[，|。|！|？|、]/g, ' ')
+          .trim()
+          .split(' ');
         setPoetry(obj);
         localStorage.setItem('POETRY', JSON.stringify(obj));
       },