What is the correct way to wrap a lazy component with Suspense in React?

4 phương ánCó giải thích

Các phương án trả lời

Chọn một phương án
Lời giảiChọn phương án để mở

Đáp án đúng: "<Suspense fallback={ <Loading /> }> <MyComponent /> </Suspense>". Suspense nhận đúng một prop tên fallback chứa phần tử hiển thị trong lúc một component con, như component tạo bằng lazy, đang tải; component cần chờ phải nằm BÊN TRONG Suspense dưới dạng con. "<Suspense loading={ <Loading /> }> <MyComponent /> </Suspense>" sai tên prop: Suspense không có prop loading nên không hiện giao diện chờ nào. "<Suspense wait={ <Loading /> }> <MyComponent /> </Suspense>" cũng sai tên prop, wait không tồn tại trên Suspense. "<Suspense fallback={ <Loading /> } loading={ <MyComponent /> } />" có fallback đúng nhưng nhét MyComponent vào một prop lạ thay vì làm con; Suspense tự đóng không có con nên MyComponent không bao giờ được render.

Cùng phần 7

Xuất hiện trong 1 bộ đề