Pfandwert für künftige Nutzung erhalten: Ein Leitfaden

Question

Ich führe eine Datenbankabfrage durch und verarbeite dann die Daten, um einen einzelnen numerischen Wert zu erzeugen. Dieser Wert muss in nachfolgenden Arrays verwendet werden.

Die Array-Definition sieht derzeit so aus (unten). Die Sache ist die: all_kdm_coverage ist ein Versprechen. Was ich aber tun muss, ist den numerischen Wert aus dem Versprechen zu extrahieren.

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

Hier ist ein größerer Codeausschnitt, um mehr Kontext bereitzustellen

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>
        </>
    );
};

Wie bekommt man am besten

in scrolls 中设置 coverage: Werte?

Update: Es wird empfohlen, Folgendes zu tun

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

Dies führt jedoch zu dem folgenden Fehler, der darauf hinweist, dass es experimentell ist und nicht vollständig unterstützt wird

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```

Answer 1

展开Bergi的评论

const scrolls = [];
all_kdm_coverage.then(coverage => { 
 scrolls.push({ 
   title: "Kadena de Mano",
   link: "./Kdm", 
   coverage, 
  }) 
})