React + Sails：处理路线

我正在开发一个使用Sails和React的Web应用程序。我使用sails的主要目的是利用MVC模式，而React用于服务视图。因为，Sails提供了自己的路由，但我想使用我的React-router。React + Sails：处理路线

例如：在react-router中我们有NotFoundRoute，所以当我访问一个不存在的页面时，它应该显示我为NotFoundRoute定义的处理程序。相反，它向我展示了风帆404页面。

那么如何在使用我的React路线时控制帆的路线？

阵营路线

var JSX = require('babel/register'), 
    React = require('react'), 
    Router = require('react-router'), 
    DefaultRoute = Router.DefaultRoute, 
    NotFoundRoute = Router.NotFoundRoute, 
    Route = Router.Route; 


var routes = (
     <Route name="splash" path="/" handler={require('../main')}> 
      <DefaultRoute handler={require('../components/Signup/signup')} /> 
      <Route name="signup" path="/user/signup" handler={require('../components/Signup/signup')} />  
      <Route name="home" path="/user/home/:id" handler={require('../components/Home/home')} /> 
      <NotFoundRoute handler={require('../components/commons/notFound')} /> 
     </Route> 
    ); 

module.exports = routes;

帆路线

module.exports.routes = { 


    '/': { 
    view: 'homepage' 
    }, 

    '/user/home/:id' : 'UserController.home' 


};

我完全新的这个框架，并不能找到足够的资源online..So对不起这个愚蠢的问题。

来源

2015-10-21 Ricky

显示您的Sails路由器代码。可能的问题是，您没有告诉Sails从您的React应用程序的index.html中提供所有**（通配符）请求。 – elithrar

@elithrar正如你所问，我已经添加了我的帆航线。请让我知道..我需要做些什么修改。 – Ricky

请参阅http://sailsjs.org/documentation/concepts/routes/custom-routes - 使用通配符路由 - '/ *' - * AFTER *您的'UserController'路由。 – elithrar

module.exports.routes = { 

    '/': { 
    view: 'homepage' 
    }, 
    '/user/home/:id' : 'UserController.home' 
    '/*' : 'ReactApp.home' 
};

你需要做一个通配符路线呈现每当API路线缺少反应的应用程序。 http://sailsjs.org/documentation/concepts/routes/custom-routes

来源

2016-07-19 06:21:59

通过https://stackoverflow.com/a/21951751/2377491

启发创建帆新mySailsApp新帆应用
全歼mySailsApp /资产的文件夹
复制myReactApp的内容/ DIST文件夹中的内容到mySailsApp /资产
与那些myReactApp的更换mySailsapp /视图/ layout.ejs的内容/距离/ index.html文件
剪切所有的非可控硅从layout.ejs文件IPT标记的内容（<body>标记之后和第一<script>标记之前，并用它的一切在layout.ejs

<body>

广场<%-body%>

在你的config/routes.js，提出：

module.exports.routes = { '/*': { view: 'homepage', skipAssets: true } }

然后就可以开始在服务器帆举，你会看到在http://localhost:1337的应用作出反应。

来源

2016-09-08 21:44:27 ebaynaud

如果您的API已经有其他路由，则必须将此属性添加到新路由中：skipRegex：/^\/api\/.*$/ – ebaynaud

React + Sails：处理路线

回答

相关问题