2016-08-11 1 views
0

Моя панель инструментов уже отображена, и теперь я хочу вызвать компонент componentWillUpdate() на этой панели инструментов, когда мне нужно обновить его состояние?Как вызвать componentWillUpdate() для обновления состояния дочерних компонентов?

HomeScreen

constructor(){ 
     super(); 

     this.state = { 
      pagenum: 0, 
      toptoolbartitle: "default", 
      homeviewtitle: "default", 
     }; 
    } 

    updateHomeViewTitle(viewtitle){ 
    console.log(viewtitle); 
    this.state.homeviewtitle = viewtitle; 
    console.log("homeviewtitle is now"+this.state.homeviewtitle); 
} 

    render() { 
    return (
     <View style={styles.container}> 
      <View style={{flex:1}}> 
      <TopToolbarAndroid 
      defaulttitle={"default"} titleupdate={this.state.homeviewtitle}/> 
        <RNCamera updateviewtitle={this.updateHomeViewTitle.bind(this)} /> 
        <BottomBar /> 
      </View> 

     </View> 

TopToolbarAndroid

constructor(props){ 
     super(); 
     this.props = props; 
     this.state = { 
      pagenum: 0, 
      title: this.props.defaulttitle 
     }; 
    } 

    componentWillUpdate(){ 
    console.log("component will update?"); 
    if (this.props.titleupdate != null) 
    {console.log("updating toolbar title to: "+this.props.titleupdate); 
     this.setState({title: this.props.titleupdate});} 
} 


    render() {  
    return (
     <ToolbarAndroid 
       title= {this.state.title} 
       style={styles.toolbar} 
     /> 
    ); 
    } 

Результат componentWillUpdate не обновляет заголовок панели инструментов, его не вызывается (повторно вынесено).

+0

если я пытаюсь использовать forceUpdate() после обратного вызова обновляет homeviewtitle, он вызывает бесконечный цикл. Я не уверен, какая часть спецификации https://facebook.github.io/react/docs/component-specs.html Im misintepreting. – jsky

+0

Я также попробовал компонентWillMount вместо componentWillUpdate – jsky

ответ

0

Нельзя сохранить статус в TopToolbarAndroid. Просто сделай это твик в TopToolbarAndroid обновить Заголовок-

title={this.props.titleupdate ? this.props.titleupdate : this.props.defaulttitle}

Избавьтесь от this.state тоже.

Я не уверен, что делает this.props = props в конструкторе. Я бы просто сделал super(props).

Дайте мне знать, если это не поможет. Просьба также предоставить ссылку на приложение runnable, чтобы люди могли эффективно решить вашу проблему. Добавьте тег react-native на свой вопрос, чтобы привлечь нужного человека.

Хост ваш пример здесь - https://rnplay.org/

Смежные вопросы