文章/答案/技术大牛

发布

问刷新后应用程序崩溃
EN

Stack Overflow用户

提问于 2017-10-09 09:58:13

回答 1查看 1K关注 0票数 0

我的应用程序出了问题。一切都很好，直到我按下刷新按钮。我想这是因为有些东西还没有准备好被渲染。

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))

知道我应该把这些变量从呈现方法移到哪里吗？那么，它的工作原理应该是在页面刷新之后吗？非常感谢你的参与。

render

reactjs

meteor

回答 1

Stack Overflow用户

回答已采纳

发布于 2017-10-09 16:58:06

假设在此组件之上正在进行订阅管理，您只需防范未准备好的数据：

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()。

Update您问过如何在withRouter中使用createContainer。我通常不使用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键。

容器教程

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/46643690

复制

相似问题

问刷新后应用程序崩溃
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问刷新后应用程序崩溃EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问刷新后应用程序崩溃
EN