问题描述
我正在尝试为我的应用程序实现中继发现。但是路由不能正常工作。路由http:// localhost:3000 /显示空白页,而http:// localhost:3000 / logo和http:// localhost:3000 / text呈现相同的Text组件。我无法找出确切的问题。请帮忙。
I have two components.
import React from 'react';
export function logo() {
return (
<div>
<p> logo component </p>
</div>
)
}
export function Text() {
return (
<div>
Text Component
</div>
)
}
我的路由如下:
import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import * as serviceWorker from "./serviceWorker";
import { browserProtocol,queryMiddleware } from "farce";
import { createFarceRouter,createRender,makeRouteConfig,Route } from "found";
import { Resolver } from "found-relay";
import environment from "./Environment";
import { graphql } from "react-relay";
import { logo,Text } from "./logo";
import App from "./App";
/* ... */
const profileQuery = graphql`
query src_Profile_Query($userId: ID!) {
userProfile(id: $userId) {
id
email
}
}
`;
const Router = createFarceRouter({
historyProtocol: new browserProtocol(),historyMiddlewares: [queryMiddleware],routeConfig: makeRouteConfig(
<Route
path="/"
Component={Text}
query={profileQuery}
prepareVariables={params => ({
...params,userId: "VXNlclByb2ZpbGVOb2RlOjc1"
})}
>
<Route path="text" Component={Text} />
<Route path="logo" Component={logo} />
</Route>
),render: createRender({})
});
ReactDOM.render(
<Router resolver={new Resolver(environment)} />,document.getElementById("root")
);
// If you want your app to work offline and load faster,you can change
// unregister() to register() below. Note this comes with some pitfalls.
serviceWorker.unregister();
与环境:
import { Environment,Network,RecordSource,Store } from "relay-runtime";
function fetchQuery(operation,variables) {
return fetch("http://localhost:8000/graphql/",{
method: "POST",headers: {
"Content-Type": "application/json"
},body: JSON.stringify({
query: operation.text,variables
})
}).then(response => {
return response.json();
});
}
const environment = new Environment({
network: Network.create(fetchQuery),store: new Store(new RecordSource())
});
export default environment;
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)