Khóa học sụp đổ 101
10 Mô-đun
5 Tuần

Những cái bàn

Nhấn vào đây để sao chép

Sử dụng bảng và lấy dữ liệu cho nó trong các ứng dụng web


Bản ghi đầu tiên xuất hiện trong cơ sở dữ liệu! Nhưng chúng tôi không nhìn thấy nó, và nó cần phải được sửa chữa. Để làm điều này, bạn cần có thành phần Table (bảng sẽ hiển thị dữ liệu cần thiết). Ngay sau khi thêm, nó sẽ yêu cầu bạn quyết định dữ liệu nào sẽ có trong đó và chọn một mô hình và điểm cuối.

Cài đặt bảng

Bảng đã tạo sẽ ngay lập tức được phát hành theo yêu cầu của bạn. Ví dụ: giới hạn số lượng bản ghi trên một trang (bảng có thể rất dài và nhiều trang), cũng như xóa các trường không được quan tâm hoặc thiết lập trường mong muốn để xuất từ các bảng liên quan.

Đồng thời, chúng tôi nhớ rằng việc bổ sung bất kỳ thành phần nào không có nghĩa là nó hoàn toàn sẵn sàng hoạt động. Bạn cần tạo ra các quy trình kinh doanh phù hợp. Đối với các bảng, rất nhiều thứ được tạo tự động, nhưng là một phần của khóa đào tạo, chúng tôi sẽ tạo mọi thứ từ đầu để đồng hóa tài liệu tốt hơn.

Trình kích hoạt bảng

Có ba trình kích hoạt được quan tâm nhiều nhất trong bảng - onDataUpdate , onShowonFilter . Hãy bắt đầu với onShow và xác định điều gì sẽ xảy ra khi bảng được hiển thị trên màn hình. Điều này sẽ yêu cầu ba khối:

1) Table Update Properties . Đặt các thuộc tính mong muốn của bảng. Ví dụ: ở đây bạn có thể giới hạn số lượng bản ghi trên một trang (đặt tham số Records per page = 10 ) và cũng hiển thị rằng trang đang ở chế độ tải dữ liệu ( Loading = true )

2) Server request GET /country/ . Để dữ liệu xuất hiện, chúng cần được đưa đi đâu đó. Và để làm điều này, hãy gửi yêu cầu tới cơ sở dữ liệu cho điểm cuối tương ứng. Đồng thời, hãy chú ý đến số lượng tham số đầu vào của điểm cuối này. Chúng cung cấp tính linh hoạt hơn trong truy vấn và chỉ lấy dữ liệu thực sự cần thiết.
Trong trường hợp của chúng tôi, chúng tôi sẽ đặt _limit = 10 vì số lượng mục trên mỗi trang là 10 và không có ích gì khi tải thêm. Ngoài ra, chúng tôi sẽ tạo thứ tự đầu ra chính xác, sắp xếp mọi thứ theo tên ( _sort_by = name ) và cũng đặt thứ tự sắp xếp. Tham số _sort_order có thể nhận giá trị ASC (từ từ Ascending , dùng để sắp xếp trực tiếp, từ giá trị nhỏ nhất đến giá trị lớn nhất) hoặc DESC ( Descending , đảo ngược thứ tự). Sắp xếp theo thứ tự bảng chữ cái trực tiếp phù hợp với chúng tôi, vì vậy _sort_order = ASC .

Tham số _with đáng được chú ý đặc biệt. Thực hiện truy vấn mà không có nó, chúng tôi chỉ có thể lấy dữ liệu về các quốc gia. Nhưng mô hình quốc gia có liên quan đến các thành phố và mặc dù dữ liệu này không thuộc về bảng được yêu cầu, chúng tôi vẫn muốn xem chúng. Để thực hiện việc này, hãy đặt _with = citys các thành phố và ngay lập tức nhận dữ liệu về các thành phố ở quốc gia này.

3) Table Update Data . Dữ liệu được nhận, nhưng nó cần được chuyển sang một bảng để hiển thị trên màn hình. Để làm điều này, chúng tôi chuyển tất cả thông tin ( data ) nhận được trong khối trước đó, cũng như tổng số bản ghi ( count - Total Records ), để hiểu có bao nhiêu trang trong bảng.

Trình kích hoạt tiếp theo là onDataUpdate . Dữ liệu trong bảng có thể được cập nhật do các quy trình kinh doanh khác nhau. Và khi điều này xảy ra, tốt nhất là chỉ định một lần điều gì sẽ xảy ra và không đặt các khối giống nhau trong mỗi quy trình kinh doanh. Trong trường hợp của chúng tôi, sẽ đúng khi sử dụng lại khối Table Update Properties , nhưng lần này là để loại bỏ chế độ tải ( Loading = false ), được đặt trước đó và cho biết rằng bảng đã sẵn sàng hoạt động.

Trình kích hoạt cuối cùng chúng ta cần là onFilter . Nó xác định những gì sẽ xảy ra tại thời điểm chuyển sang các trang khác của bảng. Để làm điều này, nó có tham số _offset , theo số trang, cho biết phần bù nào được yêu cầu khi tải dữ liệu.

Ví dụ: trong trường hợp của chúng tôi, nếu có 10 mục trên mỗi trang, thì trang thứ ba sẽ cần các mục từ 21 đến 30. Dữ liệu này sẽ được lấy từ _offset và có thể được chuyển đến Server request GET /country/ block. Nếu không, quy trình công việc sẽ hoàn toàn trùng khớp với quy trình trên trình kích hoạt TableOnShow . Trong những tình huống như vậy, sẽ hợp lý nếu có hai trình kích hoạt khác nhau khởi chạy cùng một quy trình kinh doanh.

Nhưng trong trường hợp của chúng ta, sự khác biệt quan trọng nằm ở tham số _offset . Nếu bạn để mọi thứ như trong ảnh chụp màn hình bên dưới, thì quá trình sẽ bắt đầu theo trình kích hoạt onShow , nhưng nó sẽ dừng lại ở khối Server request GET /country/ vì nó không thể nhận giá trị _offset (giá trị này được chuyển từ trình kích hoạt khác).

Tình huống này được giải quyết tốt nhất bằng cách sử dụng các biến. Hãy xem xét một ví dụ cụ thể. Chúng ta cần một biến kiểu Integer để lưu giá trị _offset . Do đó, chúng tôi sử dụng một khối Integer để khai báo biến này, nhưng hai khối Set Variable khác nhau để ghi giá trị của nó, mỗi khối được liên kết với một trình kích hoạt khác nhau.

Theo trình kích hoạt Table onShow , chúng tôi không cần bất kỳ phần bù nào, dữ liệu trong bảng được hiển thị ngay từ đầu và _offset = 0 , vì vậy chúng tôi đặt Value = 0 trong khối Set Variable .

Khi trình kích hoạt Table onFilter được khởi chạy, chúng tôi đã nhận được giá trị _offset và muốn sử dụng nó, vì vậy chúng tôi sẽ chuyển giá trị _offset của trình kích hoạt dưới dạng Value cho khối Set Variable .

Trong các bước tiếp theo, quy trình công việc của các trình kích hoạt không khác nhau, do đó, hai quy trình công việc được kết hợp thành một, mỗi quy trình có giá trị riêng của biến số nguyên cho tham số _offset .

Was this article helpful?
Vẫn đang tìm kiếm một câu trả lời?
Tham gia vào cộng đồng