mongodb - How to prevent individual form elements from updating using Meteor + React? -

i have meteor + react single-page-application basic form in it. data collected mongodb using createcontainer method , passed form component. problem facing this. user starts completing form but, if data populated form changes (by user somewhere else in world saving form), createcontainer method re-compute, in turn pushes new set of props form component , therefore overwrites user typing in. many reasons, cannot use shouldcomponentupdate lifecycle method within form component. 1 reason form contains select element, list of items should still accept reactive updates. need way of halting reactive updates, allowing others, whilst user completing form. suggestions?

export default formcontainer = createcontainer(( params ) => {      const dataformhandle = meteor.subscribe('formspub');     const dataformisready = dataformhandle.ready();     const datalisthandle = meteor.subscribe('listitemspub');     const datalistisready = datalisthandle.ready();      let name = "";     let listitems = [];     let listselectedvalue = null;      if(datalistisready) {         listitems = collections.listitemscoll.find({_id: listid}).fetch();     }      if(dataformisready) {         let formdata = collections.formscoll.find({_id: formid}).fetch();         name = formdata[0].name;         listselectedvalue = formdata[0].listselectedvalue;     }      return {         name,         listitems,         listselectedvalue     }; }, form); 

...

export default class form extends component {      constructor(props) {         super(props);         this.state = {             name: (this.props.name) ? this.props.name : "",             listselectedvalue: (this.props.listselectedvalue) ? this.props.listselectedvalue : null         };     }      componentwillreceiveprops(nextprops) {         this.setstate({name: (nextprops.name) ? nextprops.name : ""});         this.setstate({listselectedvalue: (nextprops.listselectedvalue) ?  nextprops.listselectedvalue : null});     }      updateformstate(){         var name = e.target.name;         var val = e.target.value;         if(name == "name"){this.setstate({name: val});}         if(name == "list"){             if( typeof e.target[e.target.selectedindex] != "undefined" ) {                 this.setstate({listselectedvalue: val});             }         }     }      render(){         return (             <div>                 <input type="text" name="name" value={this.state.name} onchange={this.updateformstate.bind(this)} />                 <select2                     value={this.state.listselectedvalue}                     name="list"                     onchange={this.updateformstate.bind(this)}                     options={{                         minimumresultsforsearch: infinity                     }}                     data={this.props.listitems}                 />             </div>         );      } } 

for data in form wish non-reactive specify reactive: false in .find(), example:

let formdata = collections.formscoll.find({ _id: formid },{ reactive: false }).fetch(); 

this prevent data reactively updating while form open.