3

所以我开始学习clojurescript，我正在查看不同的教程。我无法找到的一件事是在某个 html 文件上定位元素 id 来放置我的标记。

假设我有两个 html 文件，index.html 和 about.html。当 url 指向http://localhost:3449/about时，我想将下面的代码定位到 about.html 上的元素 ID“app”

代码 ：

(om/root
  (fn [data owner]
    (reify
      om/IRender
      (render [_]
        (dom/p nil (:text data)))))
  app-state
  {:target (. js/document (getElementById "app"))})

这样做的最佳方法是什么？或者也许是一个参考，所以我可以看看它。或者，也许我在这里遗漏了一些观点，也许有人可以启发我。

我也尝试过使用这个https://github.com/gf3/secretary但我不确定这是否是更好的方法，因为 url 必须有一个哈希键（http://localhost:3449/#/about）才能触发。

更新：

所以我使用了下面的答案，它确实有效，但在让它工作之前我遇到了一些问题。无论如何，有人遇到了这篇文章并使用了下面的答案，但遇到了一个未定义的问题，请检查我的最终代码。

:cljsbuild你的部分project.clj

:cljsbuild {:builds [{ :id "dev" :source-paths ["src/clj" "src/cljs"] :compiler {:output-to "resources/public/js/main.js" :output-dir "resources/public/js/out/" :optimizations :none :pretty-print true}}]}

包含 js 文件about.html

<script src="js/out/goog/base.js" type="text/javascript"></script> <script src="js/main.js" type="text/javascript"></script> <script type="text/javascript">goog.require("om_async.about");</script> <script type="text/javascript">om_async.about.init();</script>

4

1 回答 1

2

您需要将 javascript 文件添加到要使用它的 html 文件中。因此，如果您有两个不同的 html 文件 index 和 about，您将需要两个不同的 cljs 文件。

它们都将包含一个像这样初始化js的方法

(defn ^:export init []
  (om/root
    (fn [data owner]
      (reify
        om/IRender
        (render [_]
          (dom/p nil (:text data)))))
    app-state
    {:target (. js/document (getElementById "app"))}))

在您的 about.html 文件中，您将像这样调用 js：

<script type="text/javascript">your.namespace.about.init();</script>

在 index.html 中：

<script type="text/javascript">your.namespace.index.init();</script>

至少我是这样做的。我很想知道是否有更优雅的方法来做到这一点。

更新：请在此处查看导出功能的底部：https ://github.com/sveri/siwf/blob/master/src/cljs/de/sveri/siwf/groups.cljs此处为 html 模板使用函数的地方：https ://github.com/sveri/siwf/blob/master/resources/templates/groups.html

很难说你所在的地方出了什么问题，很可能是命名空间问题。
还要确保在调用之前添加已编译的 js 文件：

<script src="/js/app.js"></script>
<script type="text/javascript">your.namespace.index.init();</script>
于 2015-04-24T11:56:03.910 回答