React-ace: Kursor tidak berada di situs yang tepat

Dibuat pada 17 Nov 2017  ·  7Komentar  ·  Sumber: securingsincity/react-ace

Halo semua
Saya menemukan kursor tidak semua situs yang tepat
bagaimana saya bisa memperbaikinya?
3c634b74-650d-4cf7-a56e-f247d7e4cedd

awaiting response

Komentar yang paling membantu

@MaximusDesign Saya juga mengalami masalah ini dan menemukan bahwa ace mengandalkan font monospace.
Dalam kasus saya, masalah ini disebabkan karena pengaturan font-family global menimpa monaco yang ditetapkan ace.

Saya menemukan bahwa saya dapat menyelesaikannya dengan mengatur font di editor ke font monospace atau cukup inherit

Kami menggunakan komponen gaya sehingga solusi kami terlihat seperti ini.

const Editor = styled(AceEditor)`
    * {
        font-family: inherit;
    }
`;

Semua 7 komentar

Halo
Saya punya masalah yang sama
Saya menggunakan contoh dari demo ( http://securingsincity.github.io/react-ace/ )
Saya terbantu dengan penghapusan fontSize = {14} dari kode saya

@huangjiatian @RTKSoftware saya menemukan tweet ini yang mungkin membantu Anda https://twitter.com/Maluen0/status/862636368857583616 Kedengarannya seperti masalah yang tepat dengan soultion

Saya mengalami masalah ini ketika ukuran font di CSS memiliki nilai yang berbeda dari yang saya berikan ke alat peraga editor. Mengatasi masalah dengan menghapus ukuran font dari CSS.

Masalah yang sama. Tolong perbaiki. Atau berikan cara untuk memperbaikinya.

@MaximusDesign Saya juga mengalami masalah ini dan menemukan bahwa ace mengandalkan font monospace.
Dalam kasus saya, masalah ini disebabkan karena pengaturan font-family global menimpa monaco yang ditetapkan ace.

Saya menemukan bahwa saya dapat menyelesaikannya dengan mengatur font di editor ke font monospace atau cukup inherit

Kami menggunakan komponen gaya sehingga solusi kami terlihat seperti ini.

const Editor = styled(AceEditor)`
    * {
        font-family: inherit;
    }
`;

Saya menggunakan masalah serupa saat menghapus atau menambahkan ke editor, kursor berjarak 4 spasi dari posisi sebenarnya. Mirip dengan @MatthewLarner kami menggunakan styled-components tetapi sebagai gantinya mengatur font-family ke default Ace consolas dan mengurangi tinggi baris:

 const StyledEditor = styled.div`
      margin-top: 10px;
      * {
        font-family: consolas;
        line-height: 1;
      }
    `;

    return (
      <StyledEditor>
        <AceEditor
        mode="json"
        theme="solarized_dark"
        fontSize={14}
        value={''}
        setOptions={{
          showLineNumbers: false,
          tabSize: 2,
        }}
        editorProps={{ $blockScrolling: true }}
      />
      </StyledEditor>
    );


saya mendapat masalah yang sama, tetapi semua cara di atas tidak berhasil, lalu saya mencari solusi dari ace asal,
saya mendapatkan ini https://github.com/ajaxorg/ace/issues/2548 . itu pasti font menyebabkan masalah kursor. ubah font menjadi monospace berhasil untuk saya.
.ace_editor, .ace_editor div{ font-family:monospace }

Apakah halaman ini membantu?
0 / 5 - 0 peringkat