刷新后应用程序崩溃

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