Разобрать индекс в уценке с помощью реакции-уценки

Question

Я написал этот синтаксис, чтобы получить индекс в файле .md:

         x_i
   x~i~

response-markdown не анализировал это как нижний индекс. Я нашел пакет замечание-sub-super и этот плагин следующим образом:

             <ReactMarkdown
          renderers={customRenderers }
          plugins={[remarkSubSuper]}
        >
          {blog.content}
        </ReactMarkdown>

Это дает мне ошибку: TypeError: Cannot set property 'sub_super' of undefined. Я также добавил skipHtml=trueкомпоненту и записал это в файле .md :

        b<sub>i</sub>

Это тоже не сработало. Я использую next.js .

Answer 1

Используйте приведенный ниже код

      <ReactMarkdown children={props.content} 
components={{ 
      em: ({ node, ...props }) => { 
              if ( props.children[0] && typeof props.children[0] === 'string' && props.children[0].startsWith('^')) { 
                    return <sup>{props.children[0].substring(1)}</sup> 
               } 
              if ( props.children[0] && typeof props.children[0] === 'string' && props.children[0].startsWith('~')) { 
                    return <sub>{props.children[0].substring(1)}</sub> 
               } 
             return <i {...props} /> 
            },
 }}

В основном мы создаем новый настраиваемый плагин.