Reagiert die Komponente selbstständig, wenn eine Methode aufgerufen wird

Question

Obwohl Sie den folgenden Code nicht benötigen, um die Frage zu verstehen, habe ich sie hinzugefügt, falls Sie das Szenario visualisieren müssen. Immer wenn das Formular übermittelt wird, wird die addList-Methode aufgerufen.

Und die Komponente aktualisiert sich selbst. Aber ich habe dieses Verhalten nicht erwartet, deshalb habe ich zuerst versucht, meine Listen dem Zustand zuzuweisen, so dass sich die Komponente bei der Änderung des Zustands automatisch auf den neuesten Stand bringen würde.

Wie auch immer es sich selbst aktualisiert, aber warum? Welcher Weg ist effizienter?

import React,{Component} from 'react'; 
import TrackerReact from 'meteor/ultimatejs:tracker-react'; 
import {Lists} from '../lib/collections/lists.js'; 

export default class App extends TrackerReact(Component) { 
    constructor(){ 
     super(); 
     // this.state = {lists : this.lists()} 
    } 
    lists(){ 
     return Lists.find().fetch(); 
    } 
    addList(e){ 
     e.preventDefault(); 
     //let text = this.refs.list.value ; 
     let text = this._inputList.value ; 
     console.log(this._inputList.value); 
     Lists.insert({ 
      title : text 
     }); 
     this._inputList.value = ""; 

     //this.setState({lists : this.lists()}); 
    } 
    render() { 
     return (
      <div> 
       <h2>Lists</h2> 
       <ul> 
        {this.lists().map((a,b)=>(
         <List key={a._id} title={a.title} /> 
        ))} 
       </ul> 
       <form onSubmit={this.addList.bind(this)}> 
        <input 
         type="text" 
         ref={(input)=>{ 
          this._inputList = input ; 
         }} 
         placeholder="add list bro" 
        /> 
       </form> 
      </div> 
     ) 
    } 
} 

Answer 1

Wenn wir also einen componentWillUpdate reagieren Lebenszyklus Methode, um zu sehen hinzufügen, wenn es rerenders;

componentWillUpdate() { 
console.log('will update');  
} 

Wenn Formular eingereicht "wird Update" auf der Konsole wie erwartet angemeldet ist. Wenn wir jedoch addList als aktualisieren;

addList(e){ 
    e.preventDefault(); 
    // nothing else. 
} 

Wir sehen nicht die Ausgabe "wird aktualisiert" auf der Konsole. Das bedeutet, dass die Methode, die aufgerufen wird, nicht erfordert, dass die Komponente neu gerendert wird. Es gibt keine solche Regel. In diesem Fall handelt es sich wahrscheinlich um TrackerReact. TrackerReact könnte die Komponente zum erneuten Rendern zwingen.