Пока я работал над новым приложением, мне нужно было быстрое решение, позволяющее пользователю скопировать текущий URL-адрес в буфер обмена.
Мы хотели, чтобы пользователь знал, что он копирует, поэтому имело смысл показать элемент ввода только для чтения с кнопкой «копировать ссылку» справа. Я быстро узнал, что есть собственный способ добиться такого поведения, и хотел поделиться с вами этим небольшим фрагментом:
Обратите внимание на inputHTMLElement.setSelectionRange(0, inputHTMLElement.value.length) — мне потребовалось некоторое время, чтобы понять, что это необходимо для того, чтобы команда копирования работала должным образом в iOS 12.
Если вы хотите использовать React, вам нужно будет создать ссылку на элемент ввода HTML. Вот полный пример компонента ShareButton.tsx
:
Дайте мне знать, если это полезно, и если у вас есть какие-либо отзывы!
Если вам интересно, для какого сервиса я создавал это, то это для аккуратного небольшого расширения для Chrome, которое позволяет вам делать скриншоты любого веб-сайта, оставлять на нем аннотации и делиться результатом с друзьями и коллегами. Посетите www.usebubbles.com, если это покажется вам полезным.