รู้เบื้องต้นเกี่ยวกับ layui
Layui เป็นกรอบ UI ที่เหมาะสำหรับโปรแกรมเมอร์พื้นหลังที่มีค่าใช้จ่ายในการเรียนรู้ต่ำ การโต้ตอบรูปแบบข้อมูล JSON ด้านหน้าและแบ็กเอนด์และยังค่อนข้างเหมาะสำหรับการพัฒนาหน้าเดียว เพื่อนที่สนใจสามารถตรวจสอบเว็บไซต์อย่างเป็นทางการของ Layui
การโต้ตอบข้อมูลด้านหน้าและแบ็กเอนด์ Layui
Layui มีชุดการโต้ตอบรูปแบบข้อมูลเฉพาะของตัวเอง (นี่เป็นสิ่งสำคัญมาก) และต้องใช้พารามิเตอร์รหัส: 0, msg: "", count: ขนาดข้อมูล (int), ข้อมูล: "รายการข้อมูล" โดยทั่วไปเราเลือกที่จะห่อหุ้มและส่งคืนคลาสรับ
Layui Front Desk JS Request Regage
ในหมู่พวกเขารหัส HTML
<link rel = "stylesheet" href = "static/layui/css/layui.css" rel = "external nofollow" media = "all"/> <script type = "text/javascript" src = "layui/layui.js"> </script>
รหัส JS
layui.use (['form', 'layer', 'ตาราง'], function () {var table = layui.Table, form = layui.form, $ = layui. $; table.render ({elem: '#test' // การผูกมัด , {ฟิลด์: 'ชื่อ', ชื่อเรื่อง: 'ชื่อผู้ชาย'}, {ฟิลด์: 'parentName', ชื่อเรื่อง: 'ชื่อเมนูแม่', ความกว้าง: 150}, {ฟิลด์: 'url', ชื่อเรื่อง: 'เมนูพา ธ '}, {ฟิลด์: , {ฟิลด์: 'ordernum', ชื่อเรื่อง: 'การเรียงลำดับ'}, {แก้ไข: 'ขวา', ชื่อเรื่อง: 'การดำเนินการ', ความกว้าง: 180, จัดตำแหน่ง: 'ศูนย์', แถบเครื่องมือ: '#toolbar'} // สำหรับรายละเอียดโปรดตรวจสอบเว็บไซต์อย่างเป็นทางการของ layui 'testReload'});});รหัสพื้นหลัง Java
@RequestMapping ("/list") @ResponseBody @RequiresPerMissions ("SYS: เมนู: รายการ") รายการ LAYUI สาธารณะ (@RequestParam Map <String, Object> Params) {// Query List Query Query = New Query (Params); รายการ <Sysmenuentity> menulist = sysmenuservice.QueryList (คำถาม); int total = sysmenuservice.QueryTotal (แบบสอบถาม); pageUtils pageUtil = ใหม่ pageUtils (menulist, total, query.getLimit (), query.getPage ()); ส่งคืน layui.data (pageutil.getTotalcount (), pageutil.getList ()); -รหัสเครื่องมือ layui
คลาสสาธารณะ layui ขยาย hashmap <string, object> {ข้อมูล layui แบบคงที่สาธารณะ (จำนวนจำนวนเต็ม, รายการ <?> data) {layui r = new layui (); r.put ("รหัส", 0); r.put ("msg", ""); r.put ("นับ" นับ); r.put ("ข้อมูล", ข้อมูล); Return R; -PageUtils เป็นตัวเลือกที่นี่คุณสามารถห่อหุ้มด้วยตัวเอง
@Datapublic Class PageUtils ใช้ serializable {ส่วนตัวคงที่สุดท้าย Long SerialVersionuid = -1202716581589799959L; // บันทึกรวมทั้งหมด int รวม count; // จำนวนระเบียนต่อหน้าหน้าส่วนตัว // หน้ารวมทั้งหมด INT TotalPage; // จำนวนหน้าปัจจุบัน INT CURRPAGE ส่วนตัว; // รายการข้อมูลส่วนตัวรายการ <?> รายการ; / *** หน้า* @param รายการรายการข้อมูล* @param TotalCount บันทึกทั้งหมด* @param หน้าจำนวนเร็กคอร์ดต่อหน้า* @param Currpage หน้าปัจจุบัน*/ Public PageUtils (รายการ <?> รายการ, int totalCount, หน้า int, int currpage) {this.list = รายการ; this.totalcount = TotalCount; this.pageize = pageSize; this.currpage = currpage; this.totalPage = (int) math.ceil ((สอง) รวม/pageSize); -ในระยะสั้นรูปแบบข้อมูลที่ Layui ได้รับในที่สุดควรเป็น
ตัวอย่างข้างต้นของการเก็บข้อมูลการโต้ตอบด้านหน้าและหลังเวทีของ Layui Java เป็นเนื้อหาทั้งหมดที่ฉันแบ่งปันกับคุณ ฉันหวังว่าคุณจะให้ข้อมูลอ้างอิงและฉันหวังว่าคุณจะสนับสนุน wulin.com มากขึ้น