react的Suspense组件

import React, { useState } from 'react'

let count = 0

export default function Home(props) {
    function fn(){
        let status = 'pending'
        const promise = new Promise((res)=>{
            count++
            setTimeout(()=>{
                status = 'success'
                res(1)
            },1000)
        })
        console.log(promise)
        if(count == 1){
            throw promise
        }

    }
    fn()
    return (
        <div>
            1
        </div>
    )
}

当Suspense包含子组件时,子组件throw一个promise时,如果promise是pending状态,页面会渲染fallback组件,如果该promise状态从pending转换成fulfilled或者rejected,会重新渲染子组件。

你可能感兴趣的:(react,react.js,javascript,前端)