react floating whatsapp

フローティングwhatsappを反応します

プロジェクトにフローティングWhatsAppボタンを追加するためのシンプルなReactコンポーネント。

インストール

npm

npm i react-floating-whatsapp

糸

yarn add react-floating-whatsapp

v5.0.0-2022-10-07

• 変更の破損：デフォルトのインポートを変更するには、名前のインポートに変更します
• 壊れた変更： height Propの名前をchatboxHeightに変更します
• 壊れた変更： styles小道具をstyleに変更します
• 変更の破壊： Millisecondではなく数秒でnotificationDelay

使用法

 import React from 'react'
import { FloatingWhatsApp } from 'react-floating-whatsapp'

export default function App ( ) {

  return (
      < FloatingWhatsApp { /*  Props  */ } />
  )
}

小道具

小道具	タイプ	オプション	説明	デフォルト
phoneNumber	弦	必須	Intenatolational形式の電話番号	1234567890
accountName	弦	必須	アカウントのユーザー名	Account Name
onClick	関数	オプション	クリック時にコールバック関数が発火します	-
onSubmit	関数	オプション	コールバック関数は、イベントとフォーム入力値に合格した提出時に発火します	-
onClose	関数	オプション	コールバック関数は近くで発火します	-
onLoopDone	関数	オプション	通知ループが完了したときに呼び出されるコールバック関数	-
onNotification	関数	オプション	通知が実行されるとコールバック関数が起動しました	-
avatar	弦	オプション	静的資産を使用してユーザーアバターを変更します	UI Face
statusMessage	弦	オプション	アカウントの以下のテキストユーザー名	Typically replies within 1 hour
chatMessage	弦	オプション	チャットボックス内のテキスト。	Hello there! ? nHow can we help?
placeholder	弦	オプション	入力プレースホルダー。	Type a message..
messageDelay	番号	オプション	時間遅延その後、チャットマッセージが表示されます（秒単位）。	2
darkMode	ブール	オプション	暗いスタイル。	false
allowClickAway	ブール	オプション	ユーザーがクリックすると、チャットボックスを閉じます	false
allowEsc	ブール	オプション	Escapeキーが押されたら、チャットボックスを閉じます	false
className	弦	オプション	メインラッピングDivに適用されたCSSクラス名	floating-whatsapp
buttonClassName	弦	オプション	CSSクラス名はボタンに適用されます	floating-whatsapp-button
style	cssproperties	オプション	メインラッピングDivに適用されるインラインスタイル	{}
buttonStyle	cssproperties	オプション	ボタンに適用されるインラインスタイル	{}
chatboxHeight	番号	オプション	チャットボックスの高さを制御します	320
chatboxClassName	弦	オプション	CSSクラス名はチャットボックスに適用されます	floating-whatsapp-chatbox
chatboxStyle	cssproperties	オプション	チャットボックスに適用されるインラインスタイル	{}
notification	ブール	オプション	通知を許可する（ユーザーがチャットボックスを開いた後に無効にする）	false
notificationDelay	番号	オプション	秒単位の通知間の時間遅延	60
notificationSound	ブール	オプション	通知音を許可します	false
notificationSoundSrc	弦	オプション	通知サウンドカスタムSRC	-
notificationLoop	番号	オプション	通知ループを繰り返します	0
notificationStyle	cssproperties	オプション	通知に適用されるインラインスタイル	-
notificationClassName	弦	オプション	通知インジケーターに適用されるCSSクラス名	floating-whatsapp-notification

ライセンス

MIT©AWRAN5