Saya tidak dapat menyorot/memilih teks di komponen RichText di blok Gutenberg saya

Saya sangat baru di WordPress dan saya sangat baru di Blok Gutenberg jadi mohon maafkan kebodohan saya. Saya menggunakan komponen RichText (disediakan oleh import { useBlockProps, RichText } from '@wordpress/block-editor';) di blok Gutenberg khusus saya. Saya lampirkan ini di blok “edit” saya dan kaitkan atribut saya dengan blok ini seperti …

export default function Edit(props) {
    return (
        <div { ...useBlockProps() }>
            <div className="questions">
                <div className="questions__wrapper">
                    <div className="questions__header">
                        <RichText
                            tagName="h2"
                            className="questions__header__heading"
                            value={props.attributes.questionsHeading}
                            onChange={(content) => props.setAttributes({ questionsHeading: content })}
                            placeholder="Add Questions Heading"
                            keepPlaceholderOnFocus={true}
                        />
                    </div>
                    <div className="questions__overview">
                        <div className="questions__overview__icon">

                        </div>
                        <RichText
                            tagName="div"
                            multiline="br"
                            className="questions__overview__text"
                            value={props.attributes.questionsText}
                            onChange={(content) => props.setAttributes({ questionsText: content })}
                            placeholder="Add Questions Text"
                            keepPlaceholderOnFocus={true}
                        />
                    </div>
                    <div className="questions__control">
                    </div>
                </div>
            </div>
        </div>
    );
}

Ini adalah atribut yang saya gunakan yang dideklarasikan dalam file block.json saya.

"attributes": {
    "questionsText": {
      "type": "string"
    },
    "questionsHeading": {
      "type": "string"
    },
}

Jika saya ingin membuat hyperlink atau memformat konten RichText, kursor hilang dan teks tidak disorot (ketika saya menyeret klik mouse di atas teks atau menggunakan tombol shift dan posisi keyboard). Saya benar-benar dapat menerapkan pemformatan atau menambahkan tautan misalnya tetapi tidak ada indikator visual bahwa saya telah memilih teks. Misalnya, ini adalah blok saya dalam mode edit, saya telah menambahkan teks ke komponen RichText paling bawah, saya telah memilih beberapa teks, tetapi teks tersebut tidak disorot!?!? Saya tidak yakin apakah ini masalah CSS, masalah atribut, atau saya salah menyiapkan blok…

Jika itu membantu dalam file block.json saya, ini adalah objek “mendukung”,

"supports": {
    "html": true
  }

Jika ada yang punya ide atau saran tentang bagaimana saya bisa mengatasi masalah ini tolong beri tahu saya.

Leave a Reply

Your email address will not be published. Required fields are marked *