React-tags: рд╡реА6

рдХреЛ рдирд┐рд░реНрдорд┐рдд 14 рдирд╡ре░ 2017  ┬╖  11рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ  ┬╖  рд╕реНрд░реЛрдд: i-like-robots/react-tags

рдпрд╣ V6 рдкрд░рд┐рд╡рд░реНрддрдиреЛрдВ рдФрд░ рдмрдЧ рдлрд┐рдХреНрд╕ рдХреЛ рдЯреНрд░реИрдХ рдХрд░рдиреЗ рд╡рд╛рд▓рд╛ рдПрдХ рдХреИрдЪ-рдСрд▓ рдЗрд╢реНрдпреВ рд╣реИред

  • [x] >= рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ 16 (#113)
  • [x] autofocus рд╡рд░реНрд╖реЛрдВ рдХреЗ рд▓рд┐рдП
  • [x] delimiterChars рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ KeyboardEvent.key delimiters рдФрд░ delimiterChars рд╡рд┐рдХрд▓реНрдкреЛрдВ рдХреЛ рдорд░реНрдЬ рдХрд░реЗрдВ
  • [x] рдЗрд╡реЗрдВрдЯ рдХреЙрд▓рдмреИрдХ рдХреЛ handleX рд╕реЗ onX (#91) рдореЗрдВ рдлрд┐рд░ рд╕реЗ рдирд╛рдо рджрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдП
  • [x] handleInputChange рдХреЛ рдлрд┐рд░ рд╕реЗ рдирд╛рдо рджрд┐рдпрд╛ рдЬрд╛рдирд╛ рдЪрд╛рд╣рд┐рдП onInput
  • [x] listBoxId рдХреЙрдиреНрдлрд╝рд┐рдЧрд░ рдХрд░рдиреЗ рдпреЛрдЧреНрдп рдмрдирд╛рдПрдВ
  • [x] рд╕рдорд░реНрдерди ES6 рдореЙрдбреНрдпреВрд▓, pkg.module (#112)
  • [x] рд╢реАрд░реНрд╖-рд╕реНрддрд░реАрдп рдШрдЯрдХ рдореЗрдВ рдлрд╝рд┐рд▓реНрдЯрд░рд┐рдВрдЧ рд░рд┐рдлреИрдХреНрдЯрд░ рд╡рд┐рдХрд▓реНрдк (#115)
  • [x] рд╕рднреА рдЯреЗрдХреНрд╕реНрдЯ рдХреЛ рдХреЙрдиреНрдлрд┐рдЧрд░ рдХрд░рдиреЗ рдпреЛрдЧреНрдп рд╣реЛрдиреЗ рджреЗрдВ (CC #154)
  • [x] рдХрд╕реНрдЯрдо рд╕реБрдЭрд╛рд╡ рдШрдЯрдХ (CC #117)
  • [x] рдкреНрд░рддреНрдпреЗрдХ рдкреНрд░реЛрдк рдкрд░рд┐рд╡рд░реНрддрди рдкрд░ рдирдИ рд╡рд╕реНрддреБрдУрдВ рдХреЛ рдмрдирд╛рдиреЗ рд╕реЗ рдмрдЪрдиреЗ рдХреЗ рд▓рд┐рдП рд░рд╛рдЬреНрдп рд╕реЗ рдмрд╛рд╣рд░ рд░рд┐рдлреИрдХреНрдЯрд░ рд╡рд░реНрдЧ рдХреЗ рдирд╛рдо (#147)
  • [x] clearInputOnDelete рд╡рд┐рдХрд▓реНрдк рдирд┐рдХрд╛рд▓реЗрдВ рдФрд░ рдЯреИрдЧ рд╣рдЯрд╛рддреЗ рд╕рдордп рдЗрдирдкреБрдЯ рдХреЛ рд╕рд╛рдлрд╝ рди рдХрд░реЗрдВ (#155)

рд╕рднреА 11 рдЯрд┐рдкреНрдкрдгрд┐рдпрд╛рдБ

рдХреНрдпрд╛ рдЗрд╕реЗ рдЬрд╛рд░реА рдХрд░рдиреЗ рдХреА рдХреЛрдИ рдпреЛрдЬрдирд╛ рд╣реИ?

рдХрд╕реНрдЯрдо рд╕реБрдЭрд╛рд╡ рдШрдЯрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдирд╛ рдкрд╕рдВрдж рдХрд░реЗрдВрдЧреЗ! 6.0 рд░рд┐рд▓реАрдЬ рд╣реЛрдЧреА?

рдореИрдВрдиреЗ [email protected] рд╕реЗ npm рддрдХ рдкреНрд░рдХрд╛рд╢рд┐рдд рдХрд┐рдпрд╛ рд╣реИ, рдХреГрдкрдпрд╛ рдЗрд╕реЗ рдЖрдЬрд╝рдорд╛рдПрдВ рдФрд░ рдЕрдЧрд░ рдХреЛрдИ рд╕рдорд╕реНрдпрд╛ рд╣реЛ рддреЛ рдореБрдЭреЗ рдмрддрд╛рдПрдВ!

@ i-like-robots рд╣реБрдХ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рдХреЗ рд░рд┐рдлреИрдХреНрдЯрд░ рдХрд░рдиреЗ рдХреА рдХреЛрдИ рдпреЛрдЬрдирд╛? рд╢рд╛рдпрдж рдЙрджрд╛рд╣рд░рдгреЛрдВ рд╕реЗ рд╢реБрд░реВ рдХрд░реЗрдВ?

@theJian рдЕрднреА рдирд╣реАрдВред рдЙрджрд╛рд╣рд░рдгреЛрдВ рд╕реЗ рд╢реБрд░реВ рдХрд░рдирд╛ рд╣рд╛рд▓рд╛рдВрдХрд┐ рдПрдХ рдЕрдЪреНрдЫрд╛ рд╡рд┐рдЪрд╛рд░ рд▓рдЧрддрд╛ рд╣реИред

рдЖрдк рдЗрд╕реЗ рдХрдм рдорд░реНрдЬ рдХрд░рдиреЗ рдХреА рдпреЛрдЬрдирд╛ рдмрдирд╛ рд░рд╣реЗ рд╣реИрдВ? :)

рджреБрд░реНрднрд╛рдЧреНрдп рд╕реЗ рдореБрдЭреЗ рдмреАрдЯрд╛ рд░рд┐рд▓реАрдЬрд╝ рдкрд░ рдХреЛрдИ рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛ рдирд╣реАрдВ рдорд┐рд▓реА рд╣реИ рдЗрд╕рд▓рд┐рдП рдореИрдВ рдЗрд╕реЗ рд░рд┐рд▓реАрдЬрд╝ рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рдЕрдирд┐рдЪреНрдЫреБрдХ рд░рд╣рд╛ рд╣реВрдБред рдпрджрд┐ рдЖрдк рдЗрд╕реЗ рдЖрдЬрдорд╛рдирд╛ рдЪрд╛рд╣рддреЗ рд╣реИрдВ рддреЛ рд░реАрдбрдореА рдореЗрдВ рдирд┐рд░реНрджреЗрд╢ рд╣реИрдВ :

https://github.com/i-like-robots/react-tags/tree/6.0#installation

рддреНрд╡рд░рд┐рдд рдЙрддреНрддрд░ рдХреЗ рд▓рд┐рдП рдзрдиреНрдпрд╡рд╛рдж рдореИрдВрдиреЗ рдЕрднреА рдЗрд╕рдХрд╛ рдкрд░реАрдХреНрд╖рдг рдХрд┐рдпрд╛ рд╣реИ рдФрд░ рдпрд╣ рдЖрдХрд░реНрд╖рдг рдХреА рддрд░рд╣ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ рдмрд╕ рдЕрдкрдиреЗ рдорд╛рдЗрдЧреНрд░реЗрд╢рди рдирд┐рд░реНрджреЗрд╢реЛрдВ рдХрд╛ рдкрд╛рд▓рди рдХрд░реЗрдВ

рд╣рдорд╛рд░рд╛ рдХрд╛рд░реНрдпрд╛рдиреНрд╡рдпрди рдиреНрдпреВрдирддрдо рд╣реИред рд▓реЗрдХрд┐рди рдореИрдВ рдкреБрд╖реНрдЯрд┐ рдХрд░ рд╕рдХрддрд╛ рд╣реВрдВ рдХрд┐ рдпрд╣ рдХрд╛рдо рдХрд░рддрд╛ рд╣реИ :)

Screen Shot 2019-08-23 at 1 23 08 PM

рд╕реБрдЭрд╛рд╡реЛрдВ рдХреЛ рд▓рд╛рдиреЗ рдХреЗ рд▓рд┐рдП рдПрд╕рд┐рдВрдХреНрд╕ рдЦреЛрдЬ рдХрд╛ рдЙрдкрдпреЛрдЧ рдХрд░рддреЗ рд╕рдордп рдШрдЯрдХ рд╕рд╣реА рдврдВрдЧ рд╕реЗ рдХрд╛рдо рдирд╣реАрдВ рдХрд░реЗрдЧрд╛ рдФрд░ рдкреНрд░реЛрдк рдХреЗ рдорд╛рдзреНрдпрдо рд╕реЗ рджрд┐рдП рдЧрдП рд╕реБрдЭрд╛рд╡реЛрдВ рдХреЗ рд╕рд╛рде рд╕рд┐рдВрдХ рд╕реЗ рдмрд╛рд╣рд░ рд╣реЛ рдЬрд╛рдПрдЧрд╛ред
рдХреЛрдб рд╕реЗ рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдпрд╣ рдЕрдкрдиреА рдЖрдВрддрд░рд┐рдХ рд╕реНрдерд┐рддрд┐ рдХреЛ рдЕрджреНрдпрддрди рдХрд░рдиреЗ рдХреЗ рд▓рд┐рдП рд╕реБрдЭрд╛рд╡реЛрдВ рд╕реЗ рдкрд░рд┐рд╡рд░реНрддрдиреЛрдВ рдХреЛ рдирд╣реАрдВ рджреЗрдЦ рд░рд╣рд╛ рд╣реИред

рдкреБрдирд╢реНрдЪ: рдРрд╕рд╛ рд▓рдЧрддрд╛ рд╣реИ рдХрд┐ рдЬрдм рдЖрдк "npm i рдкреНрд░рддрд┐рдХреНрд░рд┐рдпрд╛-рдЯреИрдЧ-рд╕реНрд╡рддрдГ рдкреВрд░реНрдг" рдХрд░рддреЗ рд╣реИрдВ рддреЛ рдмреАрдЯрд╛ рд╕рдВрд╕реНрдХрд░рдг рдЕрдм рдбрд┐рдлрд╝реЙрд▓реНрдЯ рд╕рдВрд╕реНрдХрд░рдг рд╕реНрдерд╛рдкрд┐рдд рд╣реЛ рдЧрдпрд╛ рд╣реИред рдореБрдЭреЗ рдпрд╣ рд╕рдордЭрдиреЗ рдореЗрдВ рдереЛрдбрд╝рд╛ рд╕рдордп рд▓рдЧрд╛ рдХрд┐ рдХреНрдпреЛрдВ рд╣реИрдВрдбрд▓рдЗрдирдкреБрдЯ рдЪреЗрдВрдЬ рдХрд╛рдо рдирд╣реАрдВ рдХрд░ рд░рд╣рд╛ рдерд╛ред

рдЧрд▓рдд npm рд╡рд┐рддрд░рдг рдЯреИрдЧ рдпрд╣рд╛рдБ рдареАрдХ рдХрд░ рджрд┐рдпрд╛ рдЧрдпрд╛

@coxom рдореИрдВрдиреЗ рдЗрдирдкреБрдЯ рдПрд╕рд┐рдВрдХреНрд╕ рдлрд╝реЗрдЪ рдХреЗ рд╕рд╛рде рд╣рд▓ рдХрд┐рдпрд╛ @ i-like-robots рдХреНрдпрд╛ рдпрд╣ рдмрдЧ рд╣реИ?

onInput = (query) => {
            return fetch(`/search/?q=${query}`).then(result => result.json()).then((suggestions) => {
                        this.tagsRef.current.setState({ query, options: suggestions, suggestions });

рд╕рдВрдкрд╛рджрд┐рдд рдХрд░реЗрдВ: рдореИрдВрдиреЗ рдХреБрдЫ рдмрджрд▓рд╛рд╡ рдХрд┐рдП рдФрд░ рдореИрдВрдиреЗ рдЕрдВрдд рдореЗрдВ рд╕реНрдХреНрд░реЛрд▓рд░ рд╕рдХреНрд╖рдо рдФрд░ рдХреАрдк рдФрд░ рдбрд╛рдЙрди рдлреЛрдХрд╕реНрдб рд╕реНрдХреНрд░реЛрд▓рд░ рдЪрд╛рд▓ рдХреЗ рд╕рд╛рде рдмрдбрд╝реЗ рдкрд░рд┐рдгрд╛рдо рд╕реЗрдЯ рдХреЗ рд▓рд┐рдП рд╕рдорд░реНрдерди рдЬреЛрдбрд╝рд╛
image

рдХреНрдпрд╛ рдпрд╣ рдкреГрд╖реНрда рдЙрдкрдпреЛрдЧреА рдерд╛?
0 / 5 - 0 рд░реЗрдЯрд┐рдВрдЧреНрд╕