已发现现代继电器的路由不起作用

问题描述

我正在尝试为我的应用程序实现中继发现。但是路由不能正常工作。路由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 (将#修改为@)