我正在尝试解决涉及等待ES6导入的问题。我正在使用localstorage在对象属性内设置值。首先,它们都以false开头,然后在导入时分别设置为true。此操作不到一秒钟。问题是,如果代码继续执行,那么它将在加载某些组件之前执行。

一旦所有值都是真实的,我尝试了几种不同的方法仅调用callback(实际上继续执行),但是我似乎无法提出一种可行的干净解决方案。

基本上我需要这样的东西:

let exampleObj = {
    value1: true,
    value2: true,
    value3: false
}

function check() {
    for (let key in exampleObj) {
        if (!key) {
            // exampleObj[key] is false, so rerun this whole check
            check()
        }
    }
}

function start() {
    check()
    // if check() doesn't rerun, it means no `key` was still set to false.
    // therefor carry on and mount the app
    mountSomething()
}

start()


我无法解决这个问题。

任何帮助将非常感激。

编辑:

一些更多的细节可以帮助每个人。

基本上,前提是在客户端(使用Vue构建)上启用/禁用功能。所以它是这样的:


Vue路由器仅设置了一些路由
应用程序首先从API获取功能标志
如果给定功能设置为true,我将运行一个辅助方法来导入与该功能绑定的组件,然后使用vue路由器的addRoutes功能包括该路由。
在import then()方法中,我将localstorage值设置为true,因为我知道该组件确实已成功导入


快速快照:

const features = {}
const featureChecker = (feature, activity = false) => {
  features[feature] = activity

  localStorage.setItem('Features', JSON.stringify(features))
}

export const configureSomeFeatureRoute = (router) => {
  featureChecker('SomeComponent')

  import('@/path/to/SomeComponent.vue')
    .then(Home => {
      router.addRoutes([{
        name: 'some-component',
        path: '/some-path',
        component: SomeComponent.default
      }])

      featureChecker('SomeComponent', true)
    })
  }


此后,将调用start()方法,该方法然后循环遍历我的localstorage Features对象,并在继续执行和安装我的Vue应用之前,检查每个道具都设置为true。这是我努力的一部分。

最佳答案

只需使用Promise.all



let importsContainer = [];


let import1 =
  import ('@/path/to/SomeComponent.vue')
  .then(Home => {
    router.addRoutes([{
      name: 'some-component',
      path: '/some-path',
      component: SomeComponent.default
    }]);
  });

importsContainer.push(import1);


let import2 =
  import ('@/path/to/SomeComponent.vue')
  .then(Home => {
    router.addRoutes([{
      name: 'some-component',
      path: '/some-path',
      component: SomeComponent.default
    }]);
  });

importsContainer.push(import2);


Promise.all(importsContainer).then((imports) => {

  // everything is imported, do something or

});

关于javascript - 等待所有对象属性值都为true,然后继续执行代码,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/51740727/

10-10 08:10