使用cljsjs/react-day-picker的Clojurescript日期时间选择器 [英] Clojurescript date timepicker with cljsjs/react-day-picker
问题描述
我是clojure和clojurescript的新手.我只是想知道如何在clojurescript中实现该库.
I am new to clojure and clojurescript. I just to know how I can implement this library in clojurescript.
这是库的链接: https://react-day-picker .js.org/examples/basic
我已经需要在我的名称空间中添加库，例如:
I have required the library in my name space like so :
(ns woot (:require [cljsjs.react-day-picker]))
但是我不知道如何从这里开始
But I do not know how to proceed from here
当我尝试
(js/react-day-picker)
我收到此错误
#object[ReferenceError ReferenceError: react_day_picker is not defined]
(<NO_SOURCE_FILE>)
推荐答案
CLJSJS的工作方式是提供一个 externs文件，该文件可被使用，以便ClojureScript编译器避免在执行优化时弄乱名称.如果您查看文件的末尾
CLJSJS works by providing an externs file which is used so that the ClojureScript compiler avoids messing up the names when performing optimizations. If you look at the end of the file react-day-picker.ext.js in Github, you'll notice that it exports the name DayPicker in the global scope, so you probably want to do something like (js/DayPicker.) to create a new instance of DayPicker.
话虽如此，我建议您研究影子CLJS ，因为它与NPM生态系统集成会更加熟悉.我有此回购协议带有一个react-intl的小演示，它应该很容易替换几下，并使基本的react-day-picker示例正常工作.
That being said, I'd recommend you looking into Shadow-CLJS because the integration with the NPM ecosystem will be much more familiar. I have this repo with a small demo of react-intl and it should be easy to replace a few bits and have the basic react-day-picker example working.
编辑:我尝试过:
- 克隆我的cljs-react-intl存储库
- 使用npm安装
yarn install react-day-picker的react-day-picker
- 编辑文件
assets/index.html以包含所需的样式表:
- Clone my cljs-react-intl repo
- Install react-day-picker with npm:
yarn install react-day-picker - Edit the file
assets/index.htmlto include the required stylesheet:
<head>
<title>minimal react-intl example</title>
<meta charset="UTF-8">
<!- ADD THE FOLLOWING -->
<link rel="stylesheet" type="text/css" href="https://unpkg.com/react-day-picker@7.4.0/lib/style.css">
</head>
- 更新main.cljs文件以调用日选择器类:
(ns app.main
(:require ["react-day-picker" :as dp]
[reagent.core :as r]))
;; App
(defn example-app []
[:p
[:div "Here is a day picker:"]
[:> dp/DayPicker]
])
;; App initialization
(defn mount-root []
(r/render [example-app] (.getElementById js/document "app")))
(defn main! []
(mount-root)
(println "[core]: loading"))
(defn reload! []
(mount-root)
(println "[core] reloaded"))
- 以开发人员模式启动应用程序:
yarn run html
yarn shadow-cljs watch app
屏幕截图:
这篇关于使用cljsjs/react-day-picker的Clojurescript日期时间选择器的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
