React-ace: рдмреНрд░рд╛рдЙрдЬрд░ рдЕрдЯрдХ рдЧрдпрд╛ рд╣реИ рдФрд░ рдПрдбрд┐рдЯрд░ рдореЗрдВ рдЯрд╛рдЗрдк рдХрд░рдиреЗ рдХреЗ рдмрд╛рдж рдореЗрдореЛрд░реА рдмрдврд╝рддреА рд░рд╣рддреА рд╣реИ

рдХреЛ рдирд┐рд░реНрдорд┐рдд 6 рдЬреБрд▓ре░ 2017  ┬╖  4рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: securingsincity/react-ace

рд╕рдВрдХрдЯ

maxLines рдХреЛ 1 рдпрд╛ 2 рдХреЗ рд░реВрдк рдореЗрдВ рд╕реЗрдЯ рдХрд░реЗрдВ, onLoad рд░реИрдк рдореЛрдб рдХреЛ рдПрдХ рд╣реА рд╕рдордп рдореЗрдВ рд╕рддреНрдп рдХреЗ рд░реВрдк рдореЗрдВ рд╕реЗрдЯ рдХрд░реЗрдВ, рдЕрдВрддрд┐рдо рдШреБрдВрдШрд░рд╛рд▓реЗ рдмреНрд░реЗрд╕ рд╕реЗ рдкрд╣рд▓реЗ рдХреНрд▓рд┐рдХ рдХрд░реЗрдВ рдФрд░ рд╕рдВрдкрд╛рджрдХ рдХреЛ рд╕реНрд╡рдЪрд╛рд▓рд┐рдд рд░реВрдк рд╕реЗ рд╕реНрд╡рд░реВрдкрд┐рдд рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдПрдВрдЯрд░ рдмрдЯрди рдЯрд╛рдЗрдк рдХрд░реЗрдВ, рдЖрдк рдкрд╛рдПрдВрдЧреЗ рдмреНрд░рд╛рдЙрдЬрд╝рд░ рдЕрдЯрдХ рдЧрдпрд╛ рдФрд░ рдореЗрдореЛрд░реА рдмрдврд╝ рд░рд╣реА рд╣реИред

рдЖрдкрдХреА рд╕рдорд╕реНрдпрд╛ рдХреЛ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдирдореВрдирд╛ рдХреЛрдб

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

рдпрд╛ рд╕рд╛рдзрд╛рд░рдг рдкрд░рд┐рдпреЛрдЬрдирд╛ рдкрд░ рдЬрд╛рдПрдБ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдРрд╕-рд╕рдВрдкрд╛рджрдХ-рдЬрд╛рд░реА

рд╕рдВрджрд░реНрдн

рдкреНрд░рд╛рд░рдВрднрд┐рдХ рдореЗрдореЛрд░реА рдФрд░ рд╕реАрдкреАрдпреВ
tim 20170706095723
рдПрдВрдЯрд░ рдмрдЯрди рдЯрд╛рдЗрдк рдХрд░рдиреЗ рдХреЗ 10 рд╕реЗрдХрдВрдб рдмрд╛рдж
tim 20170706095813

рдкреНрд░рдЧрддрд┐ рдкрд░: #
рд╡рд┐рди 10 / рдХреНрд░реЛрдо 58 рдФрд░ рдЖрдИрдИ 11 / рд░рд┐рдПрдХреНрдЯ 15.6.1

bug unable to reproduce

рд╕рдмрд╕реЗ рдЙрдкрдпреЛрдЧреА рдЯрд┐рдкреНрдкрдгреА

рдореИрдВ рд░рд┐рдПрдХреНрдЯ v16.4, рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдРрд╕ 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 рд╕реЗ рджреВрд░ рдЬрд╛рдиреЗ рдкрд░ рд╡рд┐рдЪрд╛рд░ рдХрд┐рдпрд╛ рдХреНрдпреЛрдВрдХрд┐ рдХрдо рд╕реЗ рдХрдо рдлрд┐рд▓рд╣рд╛рд▓ рдЗрд╕реЗ рдЕрдЪреНрдЫреА рддрд░рд╣ рд╕реЗ рдмрдирд╛рдП рдирд╣реАрдВ рд░рдЦрд╛ рдЧрдпрд╛ рд╣реИ (рдЙрд░реНрдл рд░рдЦрд░рдЦрд╛рд╡ рдкреАрдЖрд░ рдореЗрдВ рд╡рд┐рд▓рдп рдпрд╛ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдирд╣реАрдВ рдХрд░рддрд╛ рд╣реИ) рд▓реЗрдХрд┐рди рдпрд╣ рдпрд╣рд╛рдВ рдПрдХ рдЕрд╡рд░реЛрдзрдХ рд╣реИ рдЬреЛ рдЗрд╕реЗ рд░реЛрдХрддрд╛ рд╣реИ .

@SecMao рдореИрдВ рдЕрдкрдиреЗ рдореИрдХ рдкрд░ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рдореЗрдВ рдЕрд╕рдорд░реНрде рд╣реВрдВред рдореБрдЭреЗ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдПрдХ рд╡рд┐рдВрдбреЛрдЬрд╝ рд▓реИрдкрдЯреЙрдк рдвреВрдВрдврдирд╛ рд╣реЛрдЧрд╛ред

@inoas рдХреНрдпрд╛ рдЖрдк рдЗрд╕ рдореБрджреНрджреЗ рдХреЛ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рдореЗрдВ рд╕рдХреНрд╖рдо рдереЗ? рдореБрдЭреЗ рдХреБрдЫ рдЯрд┐рдкреНрдкрдгрд┐рдпреЛрдВ рдХрд╛ рдЙрд▓реНрд▓реЗрдЦ рд╣реИ рдХрд┐ рдЖрдк рдХреЛрдбрдорд┐рд░рд░ рд╕реЗ рд╕реНрд╡рд┐рдЪ рдХрд░рдирд╛ рдЪрд╛рд╣ рд░рд╣реЗ рдереЗ, рд▓реЗрдХрд┐рди рдпрд╣ рд╕реНрдкрд╖реНрдЯ рдирд╣реАрдВ рд╣реИ рдХрд┐ рдЖрдкрдиреЗ рдЗрди рдореБрджреНрджреЛрдВ рдХреЛ рд╕реНрдерд╛рдиреАрдп рд░реВрдк рд╕реЗ рджреЗрдЦрд╛ рд╣реИред

рд╣рдордиреЗ рдЕрднреА рддрдХ рдХрджрдо рдирд╣реАрдВ рдЙрдард╛рдпрд╛ рд╣реИ рдФрд░ рдЕрдЧрд░ рд╣рдо рдРрд╕рд╛ рдХрд░рддреЗ рд╣реИрдВ рдФрд░ рдХрд┐рд╕реА рднреА рдорд╛рдорд▓реЗ рдореЗрдВ рд╡рд╛рдкрд╕ рд░рд┐рдкреЛрд░реНрдЯ рдХрд░рддреЗ рд╣реИрдВ рддреЛ рдЗрд╕реЗ рдкреБрди: рдкреЗрд╢ рдХрд░рдиреЗ рдХрд╛ рдкреНрд░рдпрд╛рд╕ рдХрд░реЗрдВрдЧреЗ (рдХреЛрдИ рд░рд┐рд╕рд╛рд╡ рдирд╣реАрдВ рдпрд╛ "рд░рд┐рд╕рд╛рд╡ рдЬреИрд╕рд╛ рджрд┐рдЦрддрд╛ рд╣реИ")

рдореИрдВ рд░рд┐рдПрдХреНрдЯ v16.4, рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдРрд╕ 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 рд░реЗрдЯрд┐рдВрдЧреНрд╕

рд╕рдВрдмрдВрдзрд┐рдд рдореБрджреНрджреЛрдВ

kolbinski picture kolbinski  ┬╖  5рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

venil7 picture venil7  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

avalkowsky picture avalkowsky  ┬╖  6рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

ponelat picture ponelat  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

Lyeed picture Lyeed  ┬╖  3рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ