Elm - สถาปัตยกรรม

ในบทนี้เราจะพูดถึงวิธีมาตรฐานในการสร้างแอปพลิเคชันในแพลตฟอร์ม Elm Elm ใช้รูปแบบสถาปัตยกรรมคล้ายกับรูปแบบ Model-View-Controller

ต่อไปนี้เป็นสี่ส่วนหลักของสถาปัตยกรรม Elm

  • Model
  • View
  • Message
  • Update

สถาปัตยกรรม Elm ทำงานอย่างไร

modelมีสถานะแอปพลิเคชัน ตัวอย่างเช่นหากแอปพลิเคชันแสดงรายชื่อลูกค้ารัฐจะมีข้อมูลลูกค้าแต่ละราย ในการแสดงสถานะในลักษณะที่เรียบร้อยกviewต้องสร้าง / html เมื่อผู้ใช้โต้ตอบกับมุมมองโดยการกดปุ่มหรือพิมพ์ข้อมูลในฟอร์มมุมมองจะสร้างสัญญาณที่เรียกว่าmessages. ข้อความจะถูกส่งไปยังไฟล์updateวิธีการซึ่งประเมินข้อความและดำเนินการอย่างเหมาะสม ดังนั้นวิธีการอัพเดตจะสร้างโมเดลใหม่

โมเดลใหม่สร้างมุมมองใหม่ มุมมองจะนำไปสู่การโต้ตอบใหม่จากผู้ใช้ไปยังข้อความสัญญาณซึ่งจะไปที่ฟังก์ชันการอัปเดต นอกจากนี้ฟังก์ชันจะสร้างโมเดลใหม่ ดังนั้นวงจรจะเกิดขึ้นซ้ำตามที่แสดงในแผนภาพด้านบน

รุ่น

โมเดลเกี่ยวข้องกับสถานะของแอปพลิเคชัน ไวยากรณ์สำหรับการกำหนด Model แสดงไว้ด้านล่าง -

-- Model syntax

type alias Model = {
   property1:datatype,
   proptery2:datatype
...
}

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

ดู

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

--View Syntax
view model =some_implementation

ข้อความ

ข้อความคือคำขอจากผู้ใช้เพื่อแก้ไขสถานะแอปพลิเคชัน ข้อความจะถูกส่งเป็นพารามิเตอร์ไปยังฟังก์ชันอัพเดต

--Message Syntax
type Message = Message1 |Message2 ...

ไวยากรณ์แสดงประเภทข้อความ แอปพลิเคชัน elm จะแก้ไขสถานะตามข้อความที่ส่งไป การตัดสินใจเหล่านี้เกิดขึ้นในวิธีการอัปเดต

อัปเดต

ฟังก์ชันอัพเดตจะตีความข้อความซึ่งส่งผ่านเป็นพารามิเตอร์และอัพเดตโมเดล

--Update Syntax
update Message_type model =
   some_implementation

ใช้ฟังก์ชันอัพเดต Message และ Model เป็นพารามิเตอร์