问题标签 [re-frame]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
javascript - Reagent 不会在 let 内部使用 deref-ing 重新渲染组件
我有原子foo
:
我有父组件:
我有子组件:
重置后仅更新第二段foo
。
为什么它会这样工作?
error-handling - 如何在 ClojureScript 错误消息中找到我自己的函数?
我是 ClojureScript 的新用户,我正在使用Re-frame编写应用程序。当我收到一条错误消息(来自 ClojureScript)时,在大多数情况下,我会从库中获得一个以 JavaScript 代码结尾的调用堆栈。这是意料之中的,但我没有从堆栈中自己的代码中获得函数!有时,我根本没有得到任何 ClojureScript 函数调用,只有 JavaScript 调用。有没有办法在这些错误消息中查看堆栈顶部?或者从堆栈中的代码/命名空间中查看最后一个函数?
这对我来说可能是一个巨大的帮助。即使是很小的错误(例如,在地图调用中交换操作员的位置)也很难跟踪。我应该做错了什么。
clojurescript - 网页不更新
我是重新设计的新手,我想我忘记了一些明显的事情。我的网页正在运行,但当我单击单选按钮时似乎没有更新。基本上,我想要做的是,当单击单选按钮时,它会将我的value-name
atom 更新为 2。这样做应该会导致页面刷新,因为该功能display-val
依赖于value-name
. 然而,什么也没有发生。
我觉得我应该订阅一些display-val
知道更新的东西。
这是我的代码:
clojure - 如何从 re-frame 中的事件调度事件
我按照这个例子: https ://github.com/Day8/re-frame/blob/master/docs/FAQs/PollADatabaseEvery60.md
这是我的间隔处理程序
我正在尝试从此处的另一个事件中分派此间隔事件:
但它说re-frame: no :event handler registered for: :interval
这不可能吗?
clojurescript - 从 ClojureScript 中的 React 组件派生静态 CSS
我一直在尝试并考虑通过 ClojureScript、Reagent、Rum、Re-frame 和 Om 中的各种抽象来使用 React。但是有一件事我不确定两者都可以解决,也许是因为它是一个单独的关注点,具体取决于人们如何看待它,这实际上是在组件中包含样式。虽然我也完全有可能忽略了它,但对于实际问题:
有没有办法让给 React 的样式的静态部分编译为每个组件的 CSS 类,而不是在组件的每个实例中内联?
是时候举个例子了!让我们列出一个列表,其中每个项目都应以特定方式设置样式:
使用 Reagent,上述 Hiccup 将呈现为:
正如我们所见,可以将决定颜色的规则提取到 CSS 类规则中,并将该类附加到元素上。在这种特定情况下,HTML 大小的差异不会太大,但组件的每个规则或实例都会使差距更大。
总而言之:我喜欢将与组件相关的所有内容都保留在该组件中的想法,包括样式;我只是不喜欢内联和重复不需要重复的内容。并且使用 Clojure 数据结构中声明的样式,可以使用 Clojure 核心库来操作这些样式,这很好。
clojurescript - 在输入更改时重新运行订阅
我正在尝试创建一个重新构建订阅,它从 REST API 而不是本地数据库读取数据并将这些数据保存到数据库中。REST 调用依赖于重新构建数据库中的其他值(想想 API-Key),虽然这些数据在浏览应用程序时可用,但在重新加载时不可用。我正在关注本教程:https ://github.com/Day8/re-frame/blob/master/docs/Subscribing-To-External-Data.md#some-code
我的订阅看起来像这样(为了便于阅读,去掉了):
(rf/reg-sub-raw
:organisation-users
(fn [db [_ api-token organisation]]
(when (not (nil? api-token))]
(ajax/GET
(str "/some-url/to/get/users/for/organisation")
{:params {:api-token api-token}
:handler #(rf/dispatch [:organisation-users-change %])
:format (ajax/json-request-format)
:response-format (ajax/json-response-format {:keywords? true})}))
(ratom/make-reaction
(fn [] (:organisation-users @db)))))
订阅通过 API-Key 并从服务器请求组织用户。如果数据库发生更改,它会返回一个更新订阅者的响应organisation-users
,这会在其余调用成功后立即发生。
在我的组件中,我订阅了订阅:
(defn organisation-page
[]
(let [api-token (rf/subscribe [:api-token])
organisation-users (rf/subscribe [:organisation-users @api-token])]
(fn []
[:div {:class "columns"}
))); stripped
如果我重新加载页面并在初始化(初始化 api-token)之后让organisation-page
渲染,则此代码有效。当组件在加载后立即渲染时它不起作用organisation-page
,因为 api-token 还不可用并且它不会再次执行 rest 调用。
我还尝试将整个订阅包装到反应中,但这会导致无限循环,因为每次organisation-users
数据库中的更改都会执行整个反应,这会再次执行 rest 调用,从而再次触发反应等等。
我将如何“重新构建方式”解决这个问题?organisation-users
我的一个想法是仅在数据库中尚未填充时才执行其余调用。这可能有效,但我担心如果用户稍后导航到该页面并查看旧数据,或者如果调用不成功并且用户无法通过再次导航到该页面来启动新尝试,我会遇到问题。
clojure - 使用通过 HTTP GET 传递的状态初始化 re-frame 应用程序
我正在尝试使用重新框架在 Clojure 中构建一个自包含的结帐流程,其中传递了产品列表,显示产品详细信息的摘要,必须输入个人信息(例如电子邮件和送货地址),并将生成的订单传递到订单管理组件的端点。
该架构是经过精心挑选的,以便产品列表组件以与结帐组件相同的方式自包含(从持久性到 UI)。
目前,因为在结帐完成之前不需要持久化产品列表,我认为结帐的 HTTP GET 是最好的集成方式(传递产品 ID 甚至更多产品数据)。但是,我正在努力使用重新框架来实现这一目标:
重新框架模板以如下方式启动应用程序index.html
:
...并定义环处理程序以返回index.html
“登录页面”的静态:
通常,该init()
函数现在将使用默认数据或一些后端调用持久化状态“从头开始”初始化 app-db;然后将 UI 组件添加到div#app
. 但是,我不能这样做,因为我试图初始化的产品列表是暂时的,并且是从外部提供的,例如作为 GET 调用的参数。我可以修改路线
为了获取它们,但是如何将包含的产品 ID 传递qs
到我的前端?到目前为止,我发现的所有可能性似乎都不是特别优雅:
- 读取并返回内容,
index.html
调用myproject.core.init()
替换为myproject.core.init(product-ids)
. - 替换路由
/checkout
并从-part/checkout/*
解析前端的ID 。*
- 以某种方式保留产品 ID 并将它们与会话相关联;初始化 app-db 时从服务器检索它们。
有没有更好的方法或可能性来改进其中一个解决方案的想法?
clojure - 重新构建数据库组织
我们的 Re-frame 应用程序数据库是这样组织的(针对这篇文章进行了简化):
考虑不可变下的一切:meta
。
该base
小部件通过订阅[:widget/base :cur-page-id]
然后选择来处理当前选择的页面[:meta cur-page-id :page/component]
。它还需要:page/route
当前页面的,页面本身也需要。它通过订阅(fn [db] (get-in db [cur-page-id :page/route]))
. 这可能是一种反模式,因为我们现在订阅了整个数据库。
我们可以重构它,但也许最好先知道这在性能上的成本。有没有办法正确测量这个?
例如,我们可以将路由存储:widget/base
在页面将通过仅选择的订阅查找自己的路由的条目下,从而:widget/base :routes
避免订阅整个数据库。
javascript - cljs/re-frame 中的 Ajax mailchimp 表单
我正在尝试在重新构建应用程序中实现此答案的破解。
从某种意义上说,我实际上收到了确认电子邮件,但它会引发错误并调度:on-failure
事件。
编码:
错误:
打印到控制台的内容:
编辑:
这就是我想要的,除了取决于 jquery。这与 http-xhrio 版本有什么不同?