javascript - Ractive with Require 例子

Question

嘿，我已经学习了一点 RactiveJS，到目前为止我真的很喜欢它。我想将它与 RequireJS 一起使用，发现了这个: https://github.com/Rich-Harris/Ractive/wiki/Using-Ractive-with-RequireJS

但是，它没有显示 html 模板或任何代码是如何实现的。这是我迄今为止最好的:

(function () {
    requirejs.config({
        baseUrl: 'js',
    });

    require(['alerter', 'Ractive'], function (alerter, Ractive) {
        alerter.showMessage();

        Ractive = new Ractive({
            el: 'container',
            template: "{{greeting}} {{recipient}}!",
            data: {
                'greeting': alerter.showMessage(),
                'recipient': 'mike'
            }
        });
    });
})();

所以上面的代码可以工作，但是你必须明确地将你想要的代码作为模板。

上面的链接中是否有代码的工作示例？或另一个显示如何将 require 与 ractive 一起使用但不必在模板对象中对 mustache 进行硬编码的示例。

感谢所有帮助。

Answer 1

借助 require.js，您可以使用项目页面中的“文本”插件加载文本内容:

require(['text!path/to/your/template.txt'], function (tmpl) {
    ...
    Ractive = new Ractive({
        el: 'container',
        template: tmpl,
        data: {
            'greeting': alerter.showMessage(),
            'recipient': 'mike'
        }
    });
});

希望对你有帮助，祝你好运