ไลบรารีของส่วนประกอบการตอบสนองที่ช่วยให้คุณสามารถสร้างอินเทอร์เฟซโต้ตอบที่โต้ตอบกับบริการของบุคคลที่สามที่ให้ความสามารถในการโต้ตอบกับการแชท
สำหรับการติดตั้งไลบรารีคุณต้องป้อนคำสั่งถัดไป:
npm i sova - chatkit
หากต้องการเริ่มต้นอย่างรวดเร็วและทำการเปลี่ยนแปลงส่วนประกอบไลบรารี ให้ป้อนคำสั่งถัดไปในไฟล์ App.jsx ของคุณ:
import React from "react"
import { CkComponents } from "sova-chatkit"
function App ( ) {
return (
< div className = "App" >
< CkComponents . ChatIt ckStore = { true } / >
< / div >
)
}
export default App
ไลบรารีประกอบด้วยส่วนประกอบถัดไป:
- CkComponents - ส่วนประกอบ UI ของวิดเจ็ต (ส่วนประกอบปฏิกิริยา)
- ckAPImethods - วิธีการที่ส่งผลต่อพฤติกรรมของ UI หรือการโต้ตอบกับ UI
ckStore - การจัดการเนื้อหา
คำอธิบายโดยละเอียดของห้องสมุดได้รับด้านล่าง
import { CkComponents } from "sova-chatkit"
วิดเจ็ตใช้ส่วนประกอบการตอบสนองถัดไป:
ส่วนประกอบ | |
---|---|
ตราสัญลักษณ์ | ปุ่มขยายวิดเจ็ต |
ข้อความ | ฟองข้อความพร้อมข้อมูลเกี่ยวกับมัน |
กล่องโต้ตอบ | การแสดงชุดข้อความ |
ส่วนหัว | ชื่อวิดเจ็ต |
ประเมิน | องค์ประกอบของอัตราข้อความ |
ผู้ส่ง | การป้อนข้อความและองค์ประกอบการส่ง |
แต่ละส่วนประกอบยอมรับอุปกรณ์ประกอบฉากจาก ckStore
ด้วยค่า true
หรือ false
แสดงว่าส่วนประกอบนั้นควรยึดข้อมูลจาก ckStore
ฐานหรือไม่
import { ckAPIMethods } from "sova-chatkit"
ckAPIMethods
เก็บรายการวิธีการ:
วิธีการ API | |
---|---|
รับข้อความAPI | เพิ่มข้อความไปที่ STORE |
sendMessageAPI | ส่งข้อความไปยังโมดูลเพื่อร้องขอการโทร |
styleAPI | แก้ไขธีมวิดเจ็ตหรือส่วนประกอบแต่ละรายการ |
uiManagmentAPI | เปลี่ยนการตั้งค่าส่วนประกอบใน STORE |
การตั้งค่า API | เปลี่ยนรูปภาพในวิดเจ็ต |
โมดูล API | การเชื่อมต่อโมดูลโต้ตอบ |
ภาษา API | ชุดภาษาการตั้งค่า |
วิธีการทั้งหมดส่งผลต่อข้อมูลที่เก็บไว้ ckStore
และสามารถเปลี่ยนพฤติกรรมและการแสดงผลของวิดเจ็ตได้
import { ckStore } from "sova-chatkit"
ckStore
จัดเก็บข้อมูลเนื้อหาไว้ในคีย์ส่วนกลาง:
สำคัญ | |
---|---|
ข้อความ | ประวัติข้อความผู้ใช้และคำตอบที่เข้ามา |
โมดูล | ข้อมูลของโมดูลโต้ตอบ |
การตั้งค่า | การตั้งค่ากล่องโต้ตอบและสถานะของมัน |
ภาษา | ชุดภาษาการตั้งค่า |
สไตล์ | การตั้งค่าสไตล์ของกล่องโต้ตอบและส่วนประกอบแต่ละส่วน |
ไคลเอ็นต์คอนฟิก | การตั้งค่าวิดเจ็ตระดับบนสุด |
การจัดการ | การตั้งค่าวิดเจ็ต |
นำไปใช้กับ Storeon คุณสามารถดูข้อมูลเนื้อหาทั้งหมดในเครื่องมือพัฒนาปฏิกิริยา