Saya mempunyai editor teks batu tulis dalam apl saya dan ingin memasukkan gif menggunakan pautan giphy. Saya cuba menambah menggunakan fungsi insertNodes tetapi itu seolah-olah menambah baris baharu. Saya telah menyenaraikan fungsi yang saya gunakan untuk menambah gif di bawah

function insertImage(editor, url) {
    const element = { type: 'video', url, children: [{ text: '' }] }
    Transforms.insertNodes(editor, element)
  }

Saya baru sahaja menggunakan pautan gif yang tersedia secara umum untuk memastikan saya benar-benar boleh menambahkan gif ke dalam editor. Jadi saya pasti pautan atau apa-apa lagi bukan masalahnya. Saya juga telah mencuba melakukan ini menggunakan pautan dari tempat lain tanpa kejayaan, jadi sebarang bantuan akan dihargai.

Juga menambah fungsi elemen render saya di bawah;

const renderElement = useCallback((props) => <Element {...props} />, []);

Akhir sekali ialah definisi elemen saya;

const Element = ({ attributes, children, element }) => {
  const style = { textAlign: element.align }
  switch (element.type) {
    case "block-quote":
      return (
        <blockquote style={style} {...attributes}>
          {children}
        </blockquote>
      )
    case "bulleted-list":
      return (
        <ul style={style} {...attributes}>
          {children}
        </ul>
      )
    case "heading-one":
      return (
        <h1 style={style} {...attributes}>
          {children}
        </h1>
      )
    case "heading-two":
      return (
        <h2 style={style} {...attributes}>
          {children}
        </h2>
      )
    case "list-item":
      return (
        <li style={style} {...attributes}>
          {children}
        </li>
      )
    case "numbered-list":
      return (
        <ol style={style} {...attributes}>
          {children}
        </ol>
      )
    default:
      return (
        <p style={style} {...attributes}>
          {children}
        </p>
      )
  }
}