#ภาพรวมส่วนขยายบล็อก

ใน NocoBase 2.0 กลไกการขยายบล็อกถูกทำให้ง่ายขึ้นอย่างมากครับ/ค่ะ นักพัฒนาเพียงแค่สืบทอดคลาสพื้นฐาน FlowModel ที่เกี่ยวข้อง และนำเมธอดอินเทอร์เฟซที่เกี่ยวข้องไปใช้ (โดยหลักคือเมธอด renderComponent()) ก็สามารถปรับแต่งบล็อกได้อย่างรวดเร็วครับ/ค่ะ

#ประเภทของบล็อก

NocoBase แบ่งบล็อกออกเป็นสามประเภท โดยแสดงเป็นกลุ่มในหน้าจอการตั้งค่าครับ/ค่ะ:

• บล็อกข้อมูล (Data blocks): บล็อกที่สืบทอดมาจาก DataBlockModel หรือ CollectionBlockModel
• บล็อกตัวกรอง (Filter blocks): บล็อกที่สืบทอดมาจาก FilterBlockModel
• บล็อกอื่น ๆ (Other blocks): บล็อกที่สืบทอดโดยตรงมาจาก BlockModel

การจัดกลุ่มของบล็อกจะถูกกำหนดโดยคลาสพื้นฐานที่เกี่ยวข้องครับ/ค่ะ โดยตรรกะการพิจารณาจะอิงตามความสัมพันธ์ของการสืบทอด ไม่จำเป็นต้องมีการตั้งค่าเพิ่มเติมใด ๆ ครับ/ค่ะ

#คำอธิบายคลาสพื้นฐาน

ระบบมีคลาสพื้นฐานสี่ประเภทสำหรับการขยายครับ/ค่ะ:

#BlockModel

โมเดลบล็อกพื้นฐาน ซึ่งเป็นคลาสพื้นฐานของบล็อกที่ใช้งานได้หลากหลายที่สุดครับ/ค่ะ

• เหมาะสำหรับบล็อกที่เน้นการแสดงผลเท่านั้น และไม่ขึ้นอยู่กับข้อมูล
• จะถูกจัดอยู่ในกลุ่ม Other blocks
• เหมาะสำหรับสถานการณ์ที่ต้องการปรับแต่งเฉพาะ

#DataBlockModel

โมเดลบล็อกข้อมูล (ไม่ผูกกับตารางข้อมูล) สำหรับบล็อกที่มีแหล่งข้อมูลที่กำหนดเองครับ/ค่ะ

• ไม่ได้ผูกกับตารางข้อมูลโดยตรง สามารถกำหนดตรรกะการดึงข้อมูลเองได้
• จะถูกจัดอยู่ในกลุ่ม Data blocks
• เหมาะสำหรับ: การเรียกใช้ API ภายนอก, การประมวลผลข้อมูลที่กำหนดเอง, แผนภูมิสถิติ และสถานการณ์อื่น ๆ

#CollectionBlockModel

โมเดลบล็อกคอลเลกชัน สำหรับบล็อกที่ต้องผูกกับตารางข้อมูลครับ/ค่ะ

• คลาสพื้นฐานของโมเดลที่ต้องผูกกับตารางข้อมูล
• จะถูกจัดอยู่ในกลุ่ม Data blocks
• เหมาะสำหรับ: รายการ, ฟอร์ม, กระดานคัมบัง และบล็อกอื่น ๆ ที่ขึ้นอยู่กับตารางข้อมูลที่เฉพาะเจาะจงอย่างชัดเจน

#FilterBlockModel

โมเดลบล็อกตัวกรอง สำหรับสร้างบล็อกเงื่อนไขตัวกรองครับ/ค่ะ

• คลาสพื้นฐานของโมเดลสำหรับสร้างเงื่อนไขตัวกรอง
• จะถูกจัดอยู่ในกลุ่ม Filter blocks
• โดยทั่วไปจะทำงานร่วมกับบล็อกข้อมูล

#วิธีการเลือกคลาสพื้นฐาน

ในการเลือกคลาสพื้นฐาน สามารถปฏิบัติตามหลักการดังต่อไปนี้ได้ครับ/ค่ะ:

• ต้องการผูกกับตารางข้อมูลใดตารางหนึ่ง: ให้เลือก CollectionBlockModel เป็นอันดับแรก
• แหล่งข้อมูลที่กำหนดเอง: ให้เลือก DataBlockModel
• สำหรับตั้งค่าเงื่อนไขตัวกรองและทำงานร่วมกับบล็อกข้อมูล: ให้เลือก FilterBlockModel
• ไม่แน่ใจว่าจะจัดหมวดหมู่อย่างไร: ให้เลือก BlockModel

#เริ่มต้นใช้งานอย่างรวดเร็ว

การสร้างบล็อกที่กำหนดเองต้องใช้เพียงสามขั้นตอนครับ/ค่ะ:

1. สืบทอดคลาสพื้นฐานที่เกี่ยวข้อง (เช่น BlockModel)
2. นำเมธอด renderComponent() ไปใช้เพื่อคืนค่าคอมโพเนนต์ React
3. ลงทะเบียนโมเดลบล็อกในปลั๊กอิน

สำหรับตัวอย่างโดยละเอียด โปรดดูที่ การเขียนปลั๊กอินบล็อก ครับ/ค่ะ