i chatbot

ฉัน-chatbot

องค์ประกอบที่เรียบง่ายและสวยงามสำหรับการสร้างอินเทอร์เฟซการสนทนาบน React -

เริ่มต้นใช้งาน

การติดตั้ง

 npm i i-chatbot --save

การใช้งานขั้นพื้นฐาน

นำเข้าส่วนประกอบ

 import ChatBot, { ChatBotUtil } from 'i-chatbot'

สร้างวิธีการที่จะจัดการกับเหตุการณ์ postback จากแชทบอท ควรส่งคืนอาร์เรย์ของออบเจ็กต์ข้อความเพื่อตอบกลับการกระทำของผู้ใช้ด้วยการโทรกลับ

  getStarted () {
    return [
      ChatBotUtil.textMessage(['Hi!', 'Hey there!'].any()),
      ChatBotUtil.textMessage(['How is life?', 'What's up?'].any(),
        ChatBotUtil.makeReplyButton('Great!', this.intro))
    ]
  }

  intro () {
    return [
      ChatBotUtil.textMessage('That's good to hear!')
    ]
  }

เรนเดอร์ ChatBot ด้วยวิธีการเริ่มต้นการโทรกลับและปุ่มเริ่มต้น

 <ChatBot onGetStarted={this.getStarted}
         getStartedButton={ChatBotUtil.makeGetStartedButton('Get Started')} />

แชทบอท

อุปกรณ์ประกอบฉาก

ข้อเสนอ	ค่าเริ่มต้น	พิมพ์	คำอธิบาย
เมื่อเริ่มต้นใช้งาน	-	ฟังก์ชั่น	วิธีการโทรกลับเริ่มต้นเพื่อส่งคืนข้อความแรก
getStartedButton	-	วัตถุ	พารามิเตอร์ปุ่มเริ่ม

วิธีการ

startOver (ข้อความ)

รีเซ็ตสถานะการแชทและเพิ่มออบเจ็กต์ข้อความหากไม่มีการตั้งค่าปุ่มเริ่มต้น

ChatBotUtil

วิธีการ

ข้อความ (ข้อความ ...การกระทำ)

สร้างวัตถุข้อความ

พารามิเตอร์:

ชื่อ	พิมพ์	คำอธิบาย
ข้อความ	เชือก	ข้อความ
การกระทำ	วัตถุ	วัตถุปุ่มตอบกลับด่วน

userTextMessage (ข้อความ)

สร้างวัตถุข้อความของผู้ใช้

พารามิเตอร์:

ชื่อ	พิมพ์	คำอธิบาย
ข้อความ	เชือก	ข้อความ

makeReplyButton (ชื่อเรื่อง)

สร้างปุ่มเริ่มต้นใช้งาน

พารามิเตอร์:

ชื่อ	พิมพ์	คำอธิบาย
ชื่อ	เชือก	ชื่อ

makeReplyButton (ชื่อเรื่อง, postback)

สร้างปุ่มตอบกลับด่วน

พารามิเตอร์:

ชื่อ	พิมพ์	คำอธิบาย
ชื่อ	เชือก	ชื่อ
โพสต์แบ็ค	เชือก	ค่า Postback

makeTextInputField (ชื่อเรื่อง, postback)

สร้างช่องป้อนข้อความ

พารามิเตอร์:

ชื่อ	พิมพ์	คำอธิบาย
ส่ง	เชือก	ชื่อเรื่องของปุ่มส่ง
ตัวยึดตำแหน่ง	เชือก	ตัวยึดตำแหน่งสำหรับช่องป้อนข้อมูล
โพสต์แบ็ค	เชือก	ค่า Postback

สไตล์

เนื่องจากมีการใช้โปรเซสเซอร์ล่วงหน้า CSS น้อยลง คัดลอกและแก้ไขสไตล์จาก demo/src/i-chatbot.less แล้วนำเข้าในแอปของคุณ

สร้างด้วย i-chatbot ?

• เว็บไซต์ส่วนตัวของ Oleh Stasula
• หน้า Landing Page ของ Justin Case

คุณได้สร้างสิ่งเจ๋ง ๆ ด้วย i-chatbot แล้วหรือยัง? ส่งคำขอดึงและเพิ่มลงในรายการนี้!

สิ่งที่ต้องทำ ?

• ทิศทางการแชทจากล่างขึ้นบน
• การตรวจสอบอินพุตที่ดีขึ้น
• ตัวยึดตำแหน่งอวาตาร์

ผลงาน ?

ยินดีสนับสนุนการมีส่วนร่วมของคุณไม่ว่าจะเล็กหรือใหญ่ก็ตาม!

โปรดดูคู่มือการสนับสนุนสำหรับรายละเอียดเกี่ยวกับโครงสร้างโปรเจ็กต์ สภาพแวดล้อมการพัฒนา ชุดทดสอบ รูปแบบโค้ด ฯลฯ การอัปเดตเวอร์ชันทั้งหมดมีการกล่าวถึงในบันทึกการเปลี่ยนแปลง

ใบอนุญาต ?

ห้องสมุดมีให้บริการในรูปแบบโอเพ่นซอร์สภายใต้เงื่อนไขของใบอนุญาต MIT