我试图找到一个通过
javascript API使用react-router但是到目前为止无法找到任何东西的例子.
我的目标是使用react-router与试剂和clojurescript.因此,如果有人已经开始工作(即使使用Om),我也会欣赏正确的方向.否则,只有一个没有JSX的直接javascript示例会有所帮助.
编辑1 – 更接近解决方案
感谢@FakeRainBrigand帮助将JSX转换为普通的JS.
这是React.js 0.11.2版本(这是Reagent当前版本使用的版本 – 0.4.3).
/** @jsx React.DOM */
Routes({location: "history"},Route({name: "app",path: "/",handler: App},Route({name: "inBox",handler: InBox}),Route({name: "calendar",handler: "{Calendar}"})))
提示：您可以使用JSXTransformer.js为您的React版本执行JSX-> JS转换.只需将其包含在您的页面中,然后使用浏览器的开发者控制台执行JSXTransformer.transform(‘/ ** @jsx React.DOM * /< Route location =“history”> …< / Route>‘).码
这是Clojurescript版本：
(ns mytest.core
(:require [reagent.core :as reagent :refer [atom]])
(defn home []
[:div [:h1 "Home Component Placeholder"]])
(defn info []
[:div [:h1 "Info Component Placeholder"]])
(defn build-component [comp]
(reagent/as-component (if (fn? comp) (comp) comp)))
(defn react-router []
(js/ReactRouter.Routes #js {:location "history"}
(js/ReactRouter.Route #js {:name "app" :path "/" :handler (build-component home)}
(js/ReactRouter.DefaultRoute #js {:handler (build-component home)})
(js/ReactRouter.Route #js {:name "about" :path "/about" :handler (build-component info)}))))
不幸的是,默认情况下Reagent创建的组件似乎不是“标准”React组件,因为React.isValidClass(myReagentComponent)=== false.所以剩下的就是弄清楚如何以通过该测试的形式生成组件.我发布了Stack Overflow question.
在JavaScript中0.12,它看起来像这样：
原文链接：https://www.f2er.com/react/300943.htmlvar Router = require('react-router');
var Route = React.createFactory(Router.Route);
var DefaultRoute = React.createFactory(Router.DefaultRoute);
var NotFoundRoute = React.createFactory(Router.NotFoundRoute);
React.render((
React.createElement(Router,{location: "history"},Route({path: "/",DefaultRoute({handler: Home}),Route({name: "about",handler: About}),Route({name: "users",handler: Users},Route({name: "recent-users",path: "recent",handler: RecentUsers}),Route({name: "user",path: "/user/:userId",handler: User}),NotFoundRoute({handler: UserRouteNotFound})
)
),NotFoundRoute({handler: NotFound})
)
),document.body);
