国产av日韩一区二区三区精品,成人性爱视频在线观看,国产,欧美,日韩,一区,www.成色av久久成人,2222eeee成人天堂

Gemeinschaft

Lernen

Tools-Bibliothek

KI-Tools

Freizeit

Deutsch

javascript – Datenübertragung zwischen React-Router-Unterseiten

大家講道理 2017-05-19 10:40:04

981

Wie kommuniziert man bei der Bereitstellung von Unterseiten?

import { HashRouter as Router, Route,  Link } from 'react-router-dom'

class Index extends Component {
  render() {
    return (
      <Router basename="/index">
        <p className="index-content" >
          <Link to="/library">library</Link>
          <Link to="/passbook">passbook</Link>
          <Link to="/login">login</Link>
          
          <br/>
          
          <Route path="/library" component={Library}/>
          <Route exact path="/passbook" component={Passbook}/>
          <Route path="/login" component={Login}/>
        </p>
      </Router>
    )
  }
}

export default Index;

1. Die Anmeldeseite (#/index/login) verwendet this.state.isLogin, um den Anmeldestatus zu identifizieren. Nach dem Anmelden wird this.state.isLogin wahr

2. Zu diesem Zeitpunkt wechsle ich zur Sparbuchseite (#/index/passbook) und ben?tige den isLogin der Anmeldeseite (#/index/login), um zu bestimmen, welche UI-Komponente gerendert werden soll der Anmeldeseite? Was ist mit der Sparbuchseite?

大家講道理

光陰似箭催人老，日月如移越少年。

Antworte allen(4)

大家講道理2017-05-19 10:42:04 4 Etage

react-router傳遞參數(shù)無(wú)非通過(guò)url里面的動(dòng)態(tài)匹配或者query來(lái)進(jìn)行傳遞，這個(gè)文檔中都很清楚。

但在這種登錄態(tài)的場(chǎng)景中，更好的做法不是通過(guò)cookie來(lái)進(jìn)行登錄態(tài)的確定，從而使域名下的任何一個(gè)網(wǎng)頁(yè)都能知道已經(jīng)登錄，而不需要像這樣傳遞state。

Wie +0

Antwort hinzufügen

某草草2017-05-19 10:42:04 3 Etage

兩種方式:
第一種:通過(guò)類(lèi)似redux思想，把狀態(tài)放入一個(gè)狀態(tài)機(jī)，隨用隨取，
第二種:使用history傳遞(路由跳轉(zhuǎn)),假如從路由A跳轉(zhuǎn)到路由B,路由B組件想獲取從路由A中的數(shù)據(jù)?？梢赃@樣做:

   class A extends React.Component{
      constructor(){ super(); }
      handleClick(){
          browserHistory.push({
             state:state //傳遞方式1 你需要傳遞的狀態(tài)
             query:query  //傳遞方式2  顯示在路由路徑當(dāng)中的query串，路由B也可以接收;      
         })
      }
     render …………
   }
   
   class B extends React.Component{
      constructor(){
          super();
      }
      componentWillMount(){
          //當(dāng)前傳遞過(guò)來(lái)的狀態(tài)
          console.log(this.props.location.state)
      }
      render…………
  }