как использовать модель в одном корне в реаги? - PullRequest
Новая
       3

как использовать модель в одном корне в реаги?

0 голосов
/ 27 мая 2019

Привет, у меня есть один корень, как этот код 

<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<button >Platform</button>
<button >Game</button>
<button >Score</button>
<hr />

<div id="root"></div>

index.js code 

import React from 'react';
import ReactDOM from 'react-dom';
import 'bootstrap/dist/css/bootstrap.min.css';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';


ReactDOM.render(<App />, document.getElementById('root'));

serviceWorker.unregister();

app.js code 

    import React ,{Component} from 'react';
import axios from 'axios';
import { Modal,ModalHeader,ModalBody,ModalFooter,FormGroup,Label,Input,Table ,Button} from 'reactstrap';


class App extends Component{
  state={
    books:[],
    NewBookData:{
      Title:'',
      Rating:''
    },
    EditBookData:{
      Id:'',
      Title:'',
      Rating:''
    },

    NewBookModal:false,
    EditBookModal:false
  }
....

этот корень подходит для заданий по умолчанию, но я хочу оверидировать эту корневую базу на платформе, в игре, ... как я могу работать?

Ответы [ 2 ]

1 голос
/ 31 мая 2019

Вы должны использовать маршрут, как этот код

1. Создайте файл 3 js для платформы, игры, счета, ... в папке компонентов, как этот код 

import React,{Component} from 'react';
class Game extends Component {
    render(){
    return (
     <h1>this is game page</h1> 
    );
    }
  }
  export default Game;

2. импортировать этот код в app.js 

import React,{Component} from 'react';
import {BrowserRouter as Router,NavLink} from 'react-router-dom';
import Route from 'react-router-dom/Route';
import gamePage from './Component/game';
import platformPage from './Component/platform';
import scorePage from './Component/score';

3.использование маршрута для отправки на модели 

  <Router>
<div className="App">
  <ul>
    <li>
  <NavLink to="/platform" exact activeStyle={{color:'violet'}}>Platform</NavLink>
  </li>
  <li>
  <NavLink to="/game" exact activeStyle={{color:'violet'}}>Game</NavLink>
  </li>
  <li>
  <NavLink to="/score" exact activeStyle={{color:'violet'}}>Score</NavLink>
  </li>
  </ul>
  <Route path="/platform" exact strict component={platformPage}/>

  <Route path="/game" exact strict component={gamePage}/>

  <Route path="/score" exact strict component={scorePage}  /> 

</div>
</Router>
0 голосов
/ 27 мая 2019

Вы должны создать компонент внешнего реагирования, который содержит кнопки и все вложенные компоненты для «Платформа», «Игра», «Счет». Вы должны заново составить приложение, а не «переопределить».

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...