Meteor 1.5：Blaze的動態導入

Question

我有兩個問題：

1）我想使用Meteor 1.5 Dynamic Import for Blaze，但所有示例和教程都是針對React的。 所以我很困惑它是如何使用的。 任何人都可以提供它的例子。

2）我正在使用來自atmospherejs.com的軟件包，比如amcharts，我只需要在Admin Dashboard端。 如何動態導入它們？

提前致謝！

UPDATE（解決方案）：

以下是homepage.html（父模板）

<template name="homepage">
  Homepage Content
 {{> Template.dynamic template=content}}    
</template>

login.html（子模板）

<template name="login">
  You're logged in!
</template>

login.js

import '../homepage/homepage.js';
import './login.html';
API = function () {
  BlazeLayout.render("homepage",{content: 'login'});
}

export { API }

main.js

LoadLogin = function () {
  import('/imports/modules/common/login/login.js').then(function (api) {
    api.API();
  })
}

/lib/route.js

import { FlowRouter } from 'meteor/ostrio:flow-router-extra';
FlowRouter.route('/', {
  name: 'homepage',
  action() {
    LoadLogin();
  }
});

Answer 1

我正在開發自己的管理面板Meteor Candy ，由動態導入驅動，所以我很樂意分享我是如何工作的。

首先，我們有view.html：

<template name="admin">
    Admin
</template>

其次，我們有JS邏輯：

import { Template } from 'meteor/templating';
import { Meteor } from 'meteor/meteor';
import { Blaze } from 'meteor/blaze';

import './view.html';

API = {}

API.render = function () {
     Blaze.render(Template.admin, document.body);
}

export { API }

最后，我們只需要導入該代碼並觸發我們的模板呈現到頁面中：

openAdmin = function () {
    import('./imports/admins').then(function (api) {
        api.render()
    })
}

一旦某些東西運行openAdmin()函數，模板將從服務器導入，並將調用渲染函數。

Answer 2

使用Blaze在Meteor 1.5中動態導入模塊的基本技術如下：

Template.theTemplate.events({
  'click button'(event, instance) {
    import("foo").then(Foo => {
      console.log(Foo);
    });
  }
});

確保仔細查看模塊的導入方式，因為在代碼中調用模塊時可能需要進行一些重構。 例如，使用“zxcvbn”：

WAS

const result = zxcvbn(pwd);

IS

const result = zxcvbn.default(pwd);

Answer 3

使用示例鏈接https://github.com/thesaucecode/meteor-amcharts-example/blob/master/client/example2.js非常簡單，您只需要在Template.MYTEMPLATE.onRendered(function(){});編寫代碼Template.MYTEMPLATE.onRendered(function(){});

最重要的是，你可以使用var chart作為reactive-var。