Saya sedang melakukan pertanyaan pangkalan data dan kemudian memproses data untuk menghasilkan satu nilai berangka. Nilai ini perlu digunakan dalam tatasusunan berikutnya.

Takrif tatasusunan pada masa ini kelihatan seperti ini (di bawah). Perkara itu all_kdm_coverage adalah janji. Tetapi apa yang perlu saya lakukan ialah mengekstrak nilai berangka daripada janji.

const scrolls = [
    {
        title: "Kadena de Mano",
        link: "./Kdm",
        coverage: all_kdm_coverage
    },
]

Berikut ialah coretan kod yang lebih besar untuk menyediakan lebih banyak konteks

async function GetCoverage(scroll_path) {
    const apiName = 'foo';
    const path = '/scrolls/' + scroll_path;
    const myInit = {
        headers: {},
        response: false,
    };
    const response = await API.get(apiName, path, myInit)
    console.log('response:',response)
    return response.Items
}

function GetScroll(scroll_name, scroll_array) {
    const scroll_data = scroll_array.find(scroll => scroll.Scroll === scroll_name);
    console.log('scroll_data:',scroll_data)
    return scroll_data
}

let dataGlobal;
const getData = () => (dataGlobal ??= GetCoverage("all"));

const all_kdm_coverage = getData().then(
    (data) => {
        const  kdm_entry = GetScroll("kdm", data)
        const coverage = kdm_entry.Coverage
        console.log('kdm coverage:',coverage)
        return coverage
    }
)

const scrolls = [
    {
        title: "Kadena de Mano",
        link: "./Kdm",
        coverage: all_kdm_coverage
    },
]

// For completeness, here is how the scrolls array gets used 
export const DanzanRyuCollection = () => {
    return (
        <>
            <h1 className="h1_index">Scrolls</h1>
            <Collection
                type="list"
                items={scrolls}
                gap="1.0rem"
                alignItems="center">
                {(item, index) => (
                    <ScrollCard
                        key={index}
                        padding="1rem">
                        <Link href={item.link}>
                            {item.title}
                        </Link>
                        <Rating ratings={[item.coverage]}/>
                    </ScrollCard>
                )}
            </Collection>
        </>
    );
};

dalam scrolls 中设置 coverage: nilai?

Kemas kini: Adalah disyorkan untuk melakukan perkara berikut

const scrolls = [
    {
        title: "Kadena de Mano",
        link: "./Kdm",
        coverage: await all_kdm_coverage
    },
]

Tetapi ini mengakibatkan ralat berikut, menunjukkan bahawa ia adalah percubaan dan tidak disokong sepenuhnya

Module parse failed: The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enabled it)
Error: The top-level-await experiment is not enabled (set experiments.topLevelAwait: true to enabled it)
console.error @ client.js:1
window.console.error @ next-dev.js:27
overrideMethod @ react_devtools_backend_compact.js:2367
handleErrors @ hot-dev-client.js:131
processMessage @ hot-dev-client.js:202
eval @ hot-dev-client.js:50
eval @ websocket.js:58
handleMessage @ websocket.js:57```