Как использовать значение промиса, для условия?

Question

[asd dsa]

Я хочу реализовать ленивую загрузку компонента и использовать его метод, mockedClient для условия., которое я передаю из командной строки.

Компонент ленивой загрузки:

const mockedClient = () => createMockedClient({
    mocks,
    typeDefs,
})

export {
    mockedClient
}

Место где при условии, я хочу использовать метод из компонента, что бы включать или не включать компонент в бандл

const getMockedClient = () => import("z-mock-client")
const mocked = getMockedClient ().then(prop => prop.mockedClient()) // initialize ApolloClient 
const apolloProvider = new VueApollo({
    defaultClient: MOCKED_UI ? mocked : v2,
    clients: {
        v2: MOCKED_UI ? mocked : v2
    }
})

Но вместо значения в переменной mocked я получаю это:

Promise {<pending>}
[[PromiseStatus]]: "resolved"
[[PromiseValue]]: ApolloClient

Как здлеать так, что бы в переменой mocked было инициализовано значение [[PromiseValue]] ?
Тогда я смогу вставить ее в условии где подменяется apolloClient в apolloProvider и тем самым буду добавлять или же нет компонент "z-mock-client" в джс бандл.

Answer 1

[Дмитрий]

Значение промиса можно получить либо через await, либо внутри then, вы не можете получить его напрямую, так как он выполняется асинхронно и на момент присвоения
const mocked = getMockedClient ().then(prop => prop.mockedClient())

он еще не выполнился, это просто декларация о намерениях.

То есть либо

const mocked = await getMockedClient ().then(prop => prop.mockedClient())

тогда код будет ждать выполнения промиса, перед именем функции, внутри которой используется await нужно поставить async

либо

getMockedClient ().then(prop => {
  const mocked = getMockedClient ()
  // И тут делаете с полученным значением что хотите
})

Вообще просто почитайте любую статью про промисы в инете, их полно

Answer 2

[Evgeny Kulakov]

Ну вам как бы промис возвращается и он зарезолвится когда-то позже чем ваш кусок кода.
Почему не просто что-то типа такого:

const mocked = require("z-mock-client")()
const apolloProvider = new VueApollo({
    defaultClient: MOCKED_UI ? mocked : v2,
    clients: {
        v2: MOCKED_UI ? mocked : v2
    }
})

Comments

[asd dsa]

потому что тогда ленивая загрузка потеряет смысл

[Evgeny Kulakov]

asd dsa, тогда комментарий выше справедлив, нужно либо async/await синтаксис использовать или внутри промиса инициализировать провайдер - когда он зарезолвится.