@ capawesome/ 电容- react- hooks

反应钩 电容 插件:反应状态,生命周期管理的收听器,以及您已经使用的插件API的权限处理.

特征

• 🪝 每个插件有一个子路径 – 只导入您使用的, 完全可树动
• 🔌 插件保持可选状态 – 每个电容插件都是可选的对等依赖
• 🔁 共享本地听众 – 每个事件都有一个插件收听器, 不管有多少组件订阅
• 🧹 正确的清理 – 严格Mode安全订阅/不订阅,包括同步订阅 addListener 控件
• 🖥️ 安保部门安全 - 导入任何模块均无副作用;模块范围没有浏览器 API
• 🚀 发射活动 - 捕捉在React上架前起火的事件(例如通知自带)并重放到你的钩上
• 🔑 作为钩子的权限 – 说吧 – { status, check, request } 对每个有权限 API 的插件
• 🛡️ 类型脚本 - 根据每个插件本身的定义键入

安装

npm install @capawesome/capacitor-react-hooks

安装您想要使用钩子的电容插件, 例如 :

npm install @capacitor/network

要求反应出18或19和Capacitor 8.

使用量

从插件的子路径导入钩子 :

import { useNetworkStatus } from '@capawesome/capacitor-react-hooks/capacitor/network';

const ConnectionBadge = () => {
  const status = useNetworkStatus();
  if (!status) {
    return null;
  }
  return <span>{status.connected ? 'Online' : 'Offline'}</span>;
};

权限和必要方法:

import {
  useGeolocationPermissions,
  useWatchPosition,
} from '@capawesome/capacitor-react-hooks/capacitor/geolocation';

const Tracker = () => {
  const { status, request } = useGeolocationPermissions();
  const { position, error } = useWatchPosition({ enableHighAccuracy: true });
  // ...
};

发射活动

有些事件可以在 React 挂起前开火, 例如用户点击推力 启动应用程序的通知 createRoot 他们 重放到第一个订阅的钩子 :

import { captureLaunchEvents } from '@capawesome/capacitor-react-hooks';
import { PushNotifications } from '@capacitor/push-notifications';

captureLaunchEvents([{ plugin: PushNotifications, event: 'pushNotificationActionPerformed' }]);

createRoot(document.getElementById('root')!).render(<App />);

覆盖的插件

覆盖 Capawesome, Capacitor Firebase 和 Capacit ML Kit 插件 家庭正在进行之中.

发展

npm install
npm run build
npm run test
npm run lint

这个 example 应用程序练习每个钩 :

cd example
npm install
npm run dev

许可证

见 自由主义。 。 。 .