React-ace: Π‘Ρ€Π°ΡƒΠ·Π΅Ρ€ зависаСт, Π° объСм памяти ΠΏΡ€ΠΎΠ΄ΠΎΠ»ΠΆΠ°Π΅Ρ‚ ΡƒΠ²Π΅Π»ΠΈΡ‡ΠΈΠ²Π°Ρ‚ΡŒΡΡ послС Π²Π²ΠΎΠ΄Π° тСкста Π² Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π΅

Π‘ΠΎΠ·Π΄Π°Π½Π½Ρ‹ΠΉ Π½Π° 6 июл. 2017  Β·  4ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ  Β·  Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ: securingsincity/react-ace

ΠŸΡ€ΠΎΠ±Π»Π΅ΠΌΠ°

установитС maxLines ΠΊΠ°ΠΊ 1 ΠΈΠ»ΠΈ 2, ΠΏΡ€ΠΈ этом onLoad установитС Ρ€Π΅ΠΆΠΈΠΌ пСрСноса ΠΊΠ°ΠΊ истинный ΠΎΠ΄Π½ΠΎΠ²Ρ€Π΅ΠΌΠ΅Π½Π½ΠΎ, Ρ‰Π΅Π»ΠΊΠ½ΠΈΡ‚Π΅ ΠΏΠ΅Ρ€Π΅Π΄ послСднСй Ρ„ΠΈΠ³ΡƒΡ€Π½ΠΎΠΉ скобкой ΠΈ Π½Π°ΠΆΠΌΠΈΡ‚Π΅ ΠΊΠ½ΠΎΠΏΠΊΡƒ Enter, Ρ‡Ρ‚ΠΎΠ±Ρ‹ Π²Ρ‹ΠΏΠΎΠ»Π½ΠΈΡ‚ΡŒ Ρ„ΠΎΡ€ΠΌΠ°Ρ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ Ρ€Π΅Π΄Π°ΠΊΡ‚ΠΎΡ€Π° автоматичСски, Π²Ρ‹ Π½Π°ΠΉΠ΄Π΅Ρ‚Π΅ Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ застрял ΠΈ ΠΏΠ°ΠΌΡΡ‚ΡŒ поднялась.

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠΎΠ΄Π° для воспроизвСдСния вашСй ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹

<AceEditor
      mode="json" maxLines={2} value={"{\"a\":\"b\"}"}
      onLoad={editor => editor.getSession().setUseWrapMode(true)}
/>

ΠΈΠ»ΠΈ посСтитС простой ΠΏΡ€ΠΎΠ΅ΠΊΡ‚ react-ace-editor-Issue

использованная Π»ΠΈΡ‚Π΅Ρ€Π°Ρ‚ΡƒΡ€Π°

ΠΠ°Ρ‡Π°Π»ΡŒΠ½Π°Ρ ΠΏΠ°ΠΌΡΡ‚ΡŒ ΠΈ ЦП
tim 20170706095723
10 сСкунд послС наТатия ΠΊΠ½ΠΎΠΏΠΊΠΈ Enter
tim 20170706095813

ΠŸΡ€ΠΎΠ³Ρ€Π΅ΡΡ: #
Win 10 / Chrome 58 ΠΈ IE 11 / React 15.6.1

bug unable to reproduce

Π‘Π°ΠΌΡ‹ΠΉ ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ React v16.4, react-ace v6.1.2

  1. установка с create-react-app
  2. ΠΈ протСстируйтС с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΊΠΎΠ΄Π° Π½ΠΈΠΆΠ΅, установив AceEditor с maxLines ΠΈ wrapEnabled
class App extends React.Component {
  render() {

    const props = {
      mode: 'javascript',
      theme: 'monokai',
      value: 'const test = \'hello loooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong text\'',
      maxLines: 1,
      wrapEnabled: true,
    };

    return (
      <div>
        <AceEditor {...props} />
      </div>
    );
  }
}

ΠΈ это Π²Ρ‹Π·ΠΎΠ²Π΅Ρ‚ ΠΏΠΎΠ²Ρ‹ΡˆΠ΅Π½ΠΈΠ΅ процСссора ΠΈ памяти
image

ВсС 4 ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

ΠœΡ‹ рассматривали Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ ΠΎΡ‚ΠΊΠ°Π·Π° ΠΎΡ‚ https://github.com/JedWatson/react-codemirror, ΠΏΠΎΡ‚ΠΎΠΌΡƒ Ρ‡Ρ‚ΠΎ, ΠΏΠΎ ΠΊΡ€Π°ΠΉΠ½Π΅ΠΉ ΠΌΠ΅Ρ€Π΅, Π½Π° Π΄Π°Π½Π½Ρ‹ΠΉ ΠΌΠΎΠΌΠ΅Π½Ρ‚ ΠΎΠ½ Π½Π΅ поддСрТиваСтся Π΄ΠΎΠ»ΠΆΠ½Ρ‹ΠΌ ΠΎΠ±Ρ€Π°Π·ΠΎΠΌ (Ρ‚ΠΎ Π΅ΡΡ‚ΡŒ ΡΠΎΠΏΡ€ΠΎΠ²ΠΎΠΆΠ΄Π°ΡŽΡ‰ΠΈΠΉ Π½Π΅ ΠΎΠ±ΡŠΠ΅Π΄ΠΈΠ½ΡΠ΅Ρ‚ΡΡ ΠΈ Π½Π΅ Ρ€Π΅Π°Π³ΠΈΡ€ΡƒΠ΅Ρ‚ Π½Π° PR), Π½ΠΎ это Π±Π»ΠΎΠΊΠΈΡ€ΠΎΠ²Ρ‰ΠΈΠΊ, ΠΊΠΎΡ‚ΠΎΡ€Ρ‹ΠΉ останавливаСт это .

@SecMao Π― Π½Π΅ ΠΌΠΎΠ³Ρƒ воспроизвСсти Π½Π° ΠΌΠΎΠ΅ΠΌ Mac. МнС Π½ΡƒΠΆΠ½ΠΎ Π½Π°ΠΉΡ‚ΠΈ Π½ΠΎΡƒΡ‚Π±ΡƒΠΊ с Windows для воспроизвСдСния.

@inoas ΡƒΠ΄Π°Π»ΠΎΡΡŒ Π»ΠΈ Π²Π°ΠΌ воспроизвСсти эту ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡƒ? Π― Π²ΠΈΠΆΡƒ нСсколько ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠ΅Π², Π² ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Ρ… упоминаСтся, Ρ‡Ρ‚ΠΎ Π²Ρ‹ Ρ…ΠΎΡ‚Π΅Π»ΠΈ ΠΏΠ΅Ρ€Π΅ΠΊΠ»ΡŽΡ‡ΠΈΡ‚ΡŒΡΡ с codemirror, Π½ΠΎ нСясно, Π²ΠΈΠ΄Π΅Π»ΠΈ Π»ΠΈ Π²Ρ‹ эти ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹ локально.

ΠœΡ‹ Π΅Ρ‰Π΅ Π½Π΅ сдСлали этот шаг ΠΈ попытаСмся воспроизвСсти это, Ссли сдСлаСм это, ΠΈ сообщим ΠΎΠ± этом Π² любом случаС (ΡƒΡ‚Π΅Ρ‡ΠΊΠΈ Π½Π΅Ρ‚ ΠΈΠ»ΠΈ ΡƒΡ‚Π΅Ρ‡ΠΊΠ° "ΠΏΠΎΡ…ΠΎΠΆΠ΅")

Π― ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽ React v16.4, react-ace v6.1.2

  1. установка с create-react-app
  2. ΠΈ протСстируйтС с ΠΏΠΎΠΌΠΎΡ‰ΡŒΡŽ ΠΊΠΎΠ΄Π° Π½ΠΈΠΆΠ΅, установив AceEditor с maxLines ΠΈ wrapEnabled
class App extends React.Component {
  render() {

    const props = {
      mode: 'javascript',
      theme: 'monokai',
      value: 'const test = \'hello loooooooooooooooooooooooooooooooooooooooooooooooooooooooooooooong text\'',
      maxLines: 1,
      wrapEnabled: true,
    };

    return (
      <div>
        <AceEditor {...props} />
      </div>
    );
  }
}

ΠΈ это Π²Ρ‹Π·ΠΎΠ²Π΅Ρ‚ ΠΏΠΎΠ²Ρ‹ΡˆΠ΅Π½ΠΈΠ΅ процСссора ΠΈ памяти
image

Π‘Ρ‹Π»Π° Π»ΠΈ эта страница ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ?
0 / 5 - 0 Ρ€Π΅ΠΉΡ‚ΠΈΠ½Π³ΠΈ