Một màn hình xác nhận bỏ bản nháp có nút Giữ lại. Trên Android, người dùng cũng có thể đóng hộp thoại bằng cách chạm ngoài khi ứng dụng cho phép. Hai đường tương tác cần đưa giao diện về trạng thái phù hợp, nhất là khi màn hình đã chuyển sang chờ quyết định.
Ví dụ và cách đọc
Trong dự án React Native 0.88, gọi hàm từ nút mở hộp thoại và truyền setter cho nhãn trạng thái. Bài dùng dữ liệu thử trong RAM. Tài liệu Alert mô tả tùy chọn Android cancelable cho thao tác đóng ngoài hộp thoại và onDismiss để xử lý hủy. Nút Giữ lại có onPress riêng. Hành động xác nhận là đường duy nhất trong mẫu cập nhật trạng thái đã xác nhận bỏ.
import {Alert} from 'react-native';
export function confirmDiscard(setStatus) {
Alert.alert(
'Bỏ thay đổi thử?',
'Ví dụ chỉ cập nhật nhãn trạng thái.',
[
{text: 'Giữ lại', onPress: () => setStatus('Đã giữ lại')},
{text: 'Bỏ thay đổi', onPress: () => setStatus('Đã xác nhận bỏ')},
],
{cancelable: true, onDismiss: () => setStatus('Đã giữ lại')},
);
}Kiểm tra kết quả
Trên Android, mở hộp thoại và thử ba lượt riêng. Bấm Giữ lại, chạm ngoài hộp thoại, rồi bấm Bỏ thay đổi. Kiểm tra nhãn và trạng thái bản nháp ở từng lượt. Nếu ứng dụng hỗ trợ nút Back, kiểm tra hành vi trên thiết bị đích và ghi phiên bản. Trong luồng thật, cập nhật hủy nên an toàn khi được gọi lại và thao tác xóa nên nằm trong nhánh xác nhận.
Áp dụng và giới hạn
Đối chiếu API ngày 13/11/2026. Mẫu chưa chạy Metro, native build hay thiết bị. Tùy chọn được mô tả ở đây dành cho Android. Nếu sản phẩm hỗ trợ iOS, lập kế hoạch kiểm tra riêng với cách hệ thống trình bày Alert. Giữ nhãn nút cụ thể để người dùng biết hành động nào làm mất bản nháp.
Tình huống áp dụng
Giữ thử nghiệm đầu ở một màn hình chỉ có nhãn và một nút. Như vậy nếu nhãn không đổi, bạn kiểm tra được callback nào được kích hoạt mà chưa phụ thuộc vào việc lưu bản nháp. Khi nối vào màn hình thật, một nhánh xác nhận có thể cần chờ thao tác lưu hoặc xóa hoàn tất trước khi đổi màn hình. Hiển thị kết quả theo trạng thái thực của thao tác đó.
Chọn cancelable theo mức độ quan trọng của quyết định. Với thao tác nhẹ, đóng bên ngoài có thể thuận tiện. Với thao tác đòi hỏi một quyết định rõ ràng, kiểm tra xem người dùng có cần chọn một nút cụ thể hay không và mô tả hành vi mong đợi trong test. Nếu mở hộp thoại từ một màn hình có thể bị thay thế, kiểm tra callback đến sau khi điều hướng để tránh cập nhật nhầm bản nháp. Ghi riêng kết quả từng nút và từng cách đóng khi test trên thiết bị.
