刷新後應用程序崩潰

Question

我的應用程序出現問題。一切都很好，直到我按下刷新按鈕。我認爲這是因爲某些東西還沒有準備好呈現。

import React from 'react' 
 
import { Meteor } from 'meteor/meteor' 
 
import { createContainer } from 'meteor/react-meteor-data' 
 
import { withRouter } from 'react-router' 
 

 
import LeftNavbar from '../dashboard/LeftNavbar' 
 
import UpperBar from '../dashboard/UpperBar' 
 
import NewGreetingsForm from './NewGreetingsForm' 
 
import ConfigureButtons from './ConfigureButtons' 
 

 
import Fanpages from '../../../api/Fanpages.js' 
 

 
import './Greetings.scss' 
 

 
export class Greetings extends React.Component { 
 
    constructor (props) { 
 
    super(props) 
 
    this.fanpage = this.props.user.profile.fanpages 
 

 
    this.state = { 
 
     newGreetingsText: '', 
 
     newGreetingsCharCount: 0 
 
    } 
 
    } 
 

 
    componentDidMount() { 
 
    } 
 

 
    render() { 
 
    const currentFanpage = Fanpages.findOne({fanpageName: this.fanpage}) 
 
    const currentGreeting = currentFanpage.fanpageInfo.fanpageInfo.config.greeting[0].text 
 
    return (
 
     <div className='container page'> 
 
     <UpperBar title={'Konfiguracja fanpage/Zdefiniuj greetings'} /> 
 
     <LeftNavbar /> 
 
     <div className='main-content'> 
 
      <h4 id='main-title'>{this.fanpage}</h4> 
 
      <div className='container'> 
 
      <div className='row'> 
 
       <ConfigureButtons /> 
 
       <div> 
 
       <h5 id='configure-content-right'>Zmień obecną informację</h5> 
 
       <NewGreetingsForm fanpageName={this.fanpage} placeholder={currentGreeting} /> 
 
       </div> 
 
      </div> 
 
      </div> 
 
     </div> 
 
     </div> 
 
    ) 
 
    } 
 
} 
 

 
export default withRouter(createContainer(() => ({ 
 
    user: Meteor.user() 
 
}), Greetings))

任何想法，我應該擺脫渲染方法的變量？所以它在頁面刷新後就像它應該那樣工作？非常感謝任何參與。

Answer 1

假設有訂閱管理該組件，可以只是抵禦沒有準備好上述數據回事：

render() { 
    const currentFanpage = Fanpages.findOne({fanpageName: this.fanpage}); 
    if (!currentFanpage) { 
    return (
     <div /> 
    ); 
    } else { 
    const currentGreeting = currentFanpage.fanpageInfo.config.greeting[0].text 
    return (
     // your html 
    ) 
    } 
} 

更重要的是，有父組件呈現微調，直到訂閱.ready()

更新 您問及使用createContainer與withRouter。我通常不使用withRouter和我沒有測試過這一點，但它應該是這樣的：

const container =() => { 
    const sub = Meteor.subscribe('mysub'); 
    const loading = sub.ready(); 
    const user = Meteor.user(); 
    return { loading, user }; 
} 

export default withRouter(container, Greetings)) 

是，容器有loading關鍵是綁到訂閱的狀態，最重要的事情。

Container tutorial