介绍
在前端开发中，经常需要对 URL 进行缩短，以便分享到社交媒体平台上。而 react-google-url-shortner 就是一个方便快捷的 npm 包，可以帮你快速将长 URL 转换为短 URL。
react-google-url-shortner 包依赖于 Google URL Shortener API，故使用前需要先到 Google Developers Console 上注册一下，然后在项目中配置 API key。
安装
安装 npm 包：
npm install react-google-url-shortner --save
使用方法
- 在你的项目文件中导入 react-google-url-shortner 包
import GoogleUrlShortner from 'react-google-url-shortner';
- 使用 GoogleUrlShortner 组件，并传入原始 URL
<GoogleUrlShortener longUrl={'https://www.example.com'} />在 Google Developers Console 中获取 API key
在项目中配置 API key
import GoogleUrlShortner from 'react-google-url-shortner'; GoogleUrlShortner.apiKey = 'your_api_key';
示例代码
-- -------------------- ---- -------
------ ------ - --------- - ---- --------
------ ----------------- ---- ----------------------------
----- ----------- ------- --------- -
------------------ -
-------------
------------------------ - ---------------
---------- - -
--------- --
--
-
---------------------- -
--------------- --------- -------- ---
-
-------- -
------ -
-----
------- -------
------------------ ----------------------------------- ------------------------------------------- --
----------------------------
------
--
-
-总结
react-google-url-shortner 是一个非常方便的 npm 包，可以帮助我们快速将长 URL 转换为短 URL，以便分享到社交媒体平台上。通过本文的介绍，你已经知道如何使用 react-google-url-shortner，希望对你的开发工作有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/60055bff81e8991b448d99ea