update

src/renderer/App.tsx

@@ -1,9 +1,5 @@
-import { Component } from "react";
+import { Component } from 'react';
-import
+import { Input } from 'antd';
-{ Input }
-from
-"antd"
-;
 // import Taro from "@tarojs/taro";
 // import {
 //   View,
@@ -14,9 +10,9 @@ from
 //   Editor,
 //   Textarea,
 // } from "@tarojs/components";
-import "./APP.scss";
+import './APP.scss';
 // import { AtTabBar } from "taro-ui";
-import React, { useCallback, useEffect, useState } from "react";
+import React, { useCallback, useEffect, useState } from 'react';
 // import { AtGrid } from "taro-ui";
 // import { Swiper, SwiperItem } from "@tarojs/components";
 // import { AtCard } from "taro-ui";
@@ -29,12 +25,12 @@ import React, { useCallback, useEffect, useState } from "react";
 // import { AtModal, AtModalHeader, AtModalContent, AtModalAction } from "taro-ui";
 // import { AtToast } from "taro-ui";
 // import { AtIcon } from "taro-ui";
-import see from "../../images/see.png";
+import see from '../../images/see.png';
-import group from "../../images/group.png";
+import group from '../../images/group.png';
-import { marked } from "marked";
+import { marked } from 'marked';
 // import _ from "lodash";
-import OriginMark from "./conpoments/OriginMark/index";
+import OriginMark from './conpoments/OriginMark/index';
-import TextArea from "antd/es/input/TextArea";
+import TextArea from 'antd/es/input/TextArea';
 
 // marked.use(`marked-code-jsx-renderer`);
 // marked.use(`marked-extended-tables`);
@@ -95,17 +91,15 @@ renderer.image = function (href, title, text) {
   return `<img width="300px"  src="${href}" alt="${text}"/>`;
 };
 
-
 // let  listSinbal="▫️ "
-let  listSinbal="🔸"
+let listSinbal = '🔸';
 
 // 有序列表
 renderer.list = function (body, ordered, start) {
-
   // console.log("body,ordered, start", body, ordered, start);
-  const type = ordered ? "ol" : "ul";
+  const type = ordered ? 'ol' : 'ul';
   // console.log("type===>", type);
-  const startatt = ordered && start !== 1 ? ' start="' + start + '"' : "";
+  const startatt = ordered && start !== 1 ? ' start="' + start + '"' : '';
   // 正则取值
   // const regex = /▫️\s*(.*?)<br\/?>/g;
   const regex = /([^<]*)<br\/?>/g;
@@ -117,18 +111,18 @@ renderer.list = function (body, ordered, start) {
   // console.log("texts===>", texts); // 输出: ["测试111", "测试222", "if"]
   const newArray = texts.filter((item) => item.includes(listSinbal));
   // 0️⃣',
-  const numbers = ["1️⃣", "2️⃣", "3️⃣", "4️⃣", "5️⃣", "6️⃣", "7️⃣", "8️⃣", "9️⃣", "🔟"];
+  const numbers = ['1️⃣', '2️⃣', '3️⃣', '4️⃣', '5️⃣', '6️⃣', '7️⃣', '8️⃣', '9️⃣', '🔟'];
   const string = texts
     .map((value, index) => {
       // console.log("value, index==>", value, index);
       // ${ value.indexOf("▫️ ") === -1 ? '<br/><span>111</sapn>' : ""}
       return value.indexOf(listSinbal) !== -1
         ? `<div>${
-            type === "ol" ? numbers[newArray.indexOf(value)] : listSinbal
+            type === 'ol' ? numbers[newArray.indexOf(value)] : listSinbal
-          }${value.replace(listSinbal, "")} </div>`
+          }${value.replace(listSinbal, '')} </div>`
         : `<div style="white-space:pre;">\t${value}</div>`;
     })
-    .join("");
+    .join('');
   // return `1️⃣`
   // console.log("string===>", string);
 
@@ -138,18 +132,16 @@ renderer.list = function (body, ordered, start) {
 // 无序列表  ▫️
 renderer.listitem = function (text, task, checked) {
   // return `<li>${text}</li>\n`;
-  return `${listSinbal}${text}<br/>`
+  return `${listSinbal}${text}<br/>`;
   // return `➖${text}<br/>`;
-  ;
-
 };
 
 // 任务列表
 renderer.checkbox = function (checked) {
   // ✅❌
-  return !!checked ? "✅" : "❌";
+  return !!checked ? '✅' : '❌';
   return (
-    "<input " + (checked ? 'checked="" ' : "") + 'disabled="" type="checkbox">'
+    '<input ' + (checked ? 'checked="" ' : '') + 'disabled="" type="checkbox">'
   );
 };
 
@@ -164,7 +156,7 @@ renderer.heading = function (text, level, raw) {
 // 分隔符
 renderer.hr = function () {
   // return '<hr>\n';
-  return "➖➖➖➖➖<br/>";
+  return '➖➖➖➖➖<br/>';
 };
 
 // 内联样式,使用直角引号「」
@@ -176,11 +168,12 @@ renderer.codespan = function (text) {
 // 引用符号
 renderer.blockquote = function (quote) {
   // console.log("quote", quote);
+  let content = null;
   var regex = /<p>(.*?)<\/p>/;
   var str = quote;
   var match = regex.exec(str);
   if (match != null) {
-    let content = match[1]; // 获取第一个捕获组的内容
+    content = match[1]; // 获取第一个捕获组的内容
     // console.log(content);
   }
   // <pre></pre>
@@ -192,12 +185,12 @@ renderer.table = function (header, body) {
   if (body) body = `<tbody>${body}</tbody>`;
 
   return (
-    "📊 表格 📊<br/><table>\n" +
+    '📊 表格 📊<br/><table>\n' +
-    "<thead>\n" +
+    '<thead>\n' +
     header +
-    "</thead>\n" +
+    '</thead>\n' +
     body +
-    "</table>\n"
+    '</table>\n'
   );
 };
 
@@ -205,14 +198,13 @@ renderer.tablerow = function (content) {
   return `<tr>\n${content}</tr>\n`;
 };
 
-
 renderer.tablecell = function (content, flags) {
-  const type = flags.header ? "th" : "td";
+  const type = flags.header ? 'th' : 'td';
   const tag = flags.align ? `<${type} align="${flags.align}">` : `<${type}>`;
   return tag + `|${content}` + `</${type}>\n`;
 };
 
-function cleanUrl(href:any) {
+function cleanUrl(href: any) {
   try {
     href = encodeURI(href).replace(/%25/g, '%');
   } catch (e) {
@@ -231,7 +223,7 @@ renderer.link = function (href, title, text) {
   if (title) {
     out += ' title="' + title + '"';
   }
-  out += ">" +`🌐`+ text + "</a>";
+  out += '>' + `🌐` + text + '</a>';
   // out += ">" +`🌐`+ text + "</a>"+`(${href})`;
 
   return out;
@@ -242,38 +234,38 @@ marked.use({ renderer });
 
 // export default class Index extends Component {
 const Index = () => {
+  const [inputValue, setinputValue] = useState('');
   const [markText, setmarkText] = useState(``);
+
   const [oldmarkText, setoldmarkText] = useState(null);
   const [currentRender, setcurrentRender] = useState(null);
   const [markdownTable, setmarkdownTable] = useState();
   const [tablecellArr, settablecellArr] = useState([]);
 
-  const onConfirm = (onConfirmtxt:any) => {
+  const onConfirm = (onConfirmtxt: any) => {
-    console.log("onConfirmtxt--->", onConfirmtxt.detail.value);
+    console.log('onConfirmtxt--->', onConfirmtxt.detail.value);
   };
-  const onBlur = (onBlurtxt:any) => {
+  const onBlur = (onBlurtxt: any) => {
-    console.log("onBlurtxt--->", onBlurtxt.detail.value);
+    console.log('onBlurtxt--->', onBlurtxt.detail.value);
     if (onBlurtxt.detail.value) {
       setmarkText(onBlurtxt.detail.value);
     }
   };
-  const onInput = (onInputtxt:any) => {
+  const onInput = (onInputtxt: any) => {
-    console.log("onInputtxt--->", onInputtxt);
+    console.log('onInputtxt--->', onInputtxt);
-    let value=onInputtxt?.target?.innerText
+    // console.log('inputValue',inputValue)
+    let value = onInputtxt?.target?.value;
     if (value) {
       setmarkText(value);
     }
   };
 
-
-
   useEffect(() => {}, []);
 
   return (
     <div className="index">
-
       <div className="left">
-        <TextArea 
+        <TextArea
           // styles="background:#fff;width:100%;min-height:80px;padding:0 30rpx;"
           // autoHeight
           className="TextArea"
@@ -285,6 +277,7 @@ const Index = () => {
           onChange={onInput}
           // maxlength={-1}
           showCount
+          // value={inputValue}
         />
       </div>
       {markText ? (