react chat ui
0.4
مكتبة مكونات React لبناء واجهة المستخدم للدردشة.
برعاية انتهازي Chatkit:
التمرير التلقائي إلى الأسفل
سهل الاستخدام للغاية
تجميع مستخدمين متعددين (جربه في العرض التوضيحي)
ضع في اعتبارك أن هذا المشروع لا يزال في المراحل الأولى من التطوير. إذا واجهت خطأً أو كان لديك طلب ميزة، فيرجى إنشاء مشكلة و/أو إرسال تغريدة لي هنا.
npm install react-chat-ui --save
استيراد { ChatFeed، رسالة } من 'react-chat-ui'// عناصر التعليمات البرمجية الخاصة بك...render() { return (// JSX...<ChatFeed messages={this.state.messages} // المصفوفة: قائمة كائنات الرسائل isTyping={this.state.is_typing} // منطقية: هو المستلم الذي يكتب hasInputField={false} // منطقي: استخدم مدخلاتنا، أو استخدم showSenderName الخاص بك // أظهر اسم المستخدم الذي أرسل الرسالة bubbleCentered={false} // منطقي يجب أن تتمركز الفقاعات في Feed? // JSON: أنماط الفقاعات المخصصة bubbleStyles={{ text: {fontSize: 30 }, chatbubble: {borderRadius: 70,padding: 40 }} }/>// JSX الخاص بك... )}
تأكد من الاحتفاظ بقائمة كائنات الرسالة المناسبة في حالة صفك. مثل ذلك:
//...هذه الحالة = { messages: [new message({ id: 1, message: "أنا المستلم! (الشخص الذي تتحدث إليه)"،})، // فقاعة رماديةnew message({ id: 0, message: "أنا" أنت - الفقاعة الزرقاء!" })، // الفقاعة الزرقاء ]، //...};//...
تغذية الدردشة
رسالة
ChatBubble
BubbleGroup
المساهمات هي دائما موضع ترحيب وتشجيعها. إذا كنت لا ترغب في كتابة طلب ميزة بنفسك، فأخبرك بذلك (إما على Twitter أو عن طريق إنشاء طلب سحب) وسأقوم بتشفير هذا الهراء على الفور.
الوثائق
الوثائق
الوثائق
تطوير الغزل