首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >ReactJS Cordova路由器问题

ReactJS Cordova路由器问题
EN

Stack Overflow用户
提问于 2017-11-17 03:12:59
回答 1查看 935关注 0票数 0

我正在创建一个简单的应用程序与ReactJS和科尔多瓦。当我运行npm start时,这个应用运行得很好。但是,当我执行npm run build并将build文件夹复制到cordova项目的www文件夹中时,当我在android中运行它时,我得到一个空白屏幕。如果我运行cordova浏览器,路由器不工作,并且它在index.html上着陆。我想我已经将范围缩小到cordova的路由器问题,路由没有将页面设置为主页。其他人有过这样的问题吗?我使用npm create- reactJS -app创建了我的应用程序项目。

https://github.com/bscott8605/reactRouterTest

文件夹结构

代码语言:javascript
复制
import React, { Component } from 'react'
import { BrowserRouter as Router } from 'react-router-dom'
import { Switch, Route } from 'react-router'
import Home from './Home'
import AddNote from './AddNote'
import Note from './Note'

class Main extends Component {    
    render() {
      let notes;

      if(this.props.notesList)
      {
          //console.log(this.props);
          notes = this.props.notesList.map(note => {
              return(
                  <Note key={note.title} note={note} />
              );
          });
      }
      return (
          <Router>
        <div>
                <Switch>
                    <Route exact path='/' component={Home}/>
                    <Route path='/AddNote' component={AddNote}/>
                    {/*<Route exact path='/' render={(props) => (<Home {...props} data={notes}/>)}/>
                    <Route exact path='/AddNote' render={(props) => (<AddNote {...props} addNoteMethod={this.props.addNoteMethod}/>)}/>*/}
                </Switch>
        </div>
       </Router>
      );
    }
  }

  export default Main;
EN

回答 1

Stack Overflow用户

发布于 2018-06-04 08:18:56

将BrowserRouter更改为路由器

代码语言:javascript
复制
import React from 'react';
import ReactDOM from 'react-dom';
import { Router } from 'react-router-dom';
import { Provider } from 'react-redux';
import createHistory from 'history/createHashHistory'

import store from './app/redux/store';
import Layout from './app/pages/layout';
import Routes from './app/pages/routes';

import './app/assets/favicon.ico';
import './app/assets/scss/main.scss';

const history = createHistory();
console.log(history);
const Dom = (
  <Provider store={store}>
    <Router history={history}>
      <Layout>
        <Routes />
      </Layout>
    </Router>
  </Provider>
);

ReactDOM.render(
  Dom,
  document.getElementById('app'),
);
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/47337403

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档