React Native - Firestore wait render until query ends

Multi tool use
Multi tool use








up vote
0
down vote

favorite












Im making an app by using react native and firestore.
Here a piece of my code;



getData(mat)
 let count = 0;
 let val;
db.collection("Yemek").doc("Materials").collection(mat).get().then((querySnapshot) => 
 querySnapshot.forEach((doc) => 
 count++;
 val = doc.data().value;
 matKey = mat+count.toString();
 this.state.array.push([
 meal=mat, value=val, status=false, key=matKey 
 ]);
 );
).catch(err => 
 console.log('Error getting documents', err);
 return false;
 );

componentWillMount()
 this.getData('vegetables');
 this.getData('legumes');
 this.getData('meat');
 this.getData('milk');
 this.getData('others');

render() 
return (//Render components)


Im rendering components with array located in state. But its return null because app rendering components before query ends. I searched yesterday. i guess i should use promises but i failed to use that. Could you help me?






firebase react-native google-cloud-firestore expo







share|improve this question



























    up vote
    0
    down vote

    favorite












    Im making an app by using react native and firestore.
    Here a piece of my code;



    getData(mat)
     let count = 0;
     let val;
    db.collection("Yemek").doc("Materials").collection(mat).get().then((querySnapshot) => 
     querySnapshot.forEach((doc) => 
     count++;
     val = doc.data().value;
     matKey = mat+count.toString();
     this.state.array.push([
     meal=mat, value=val, status=false, key=matKey 
     ]);
     );
    ).catch(err => 
     console.log('Error getting documents', err);
     return false;
     );

    componentWillMount()
     this.getData('vegetables');
     this.getData('legumes');
     this.getData('meat');
     this.getData('milk');
     this.getData('others');

    render() 
    return (//Render components)


    Im rendering components with array located in state. But its return null because app rendering components before query ends. I searched yesterday. i guess i should use promises but i failed to use that. Could you help me?






    firebase react-native google-cloud-firestore expo







    share|improve this question

























      up vote
      0
      down vote

      favorite









      up vote
      0
      down vote

      favorite











      Im making an app by using react native and firestore.
      Here a piece of my code;



      getData(mat)
       let count = 0;
       let val;
      db.collection("Yemek").doc("Materials").collection(mat).get().then((querySnapshot) => 
       querySnapshot.forEach((doc) => 
       count++;
       val = doc.data().value;
       matKey = mat+count.toString();
       this.state.array.push([
       meal=mat, value=val, status=false, key=matKey 
       ]);
       );
      ).catch(err => 
       console.log('Error getting documents', err);
       return false;
       );

      componentWillMount()
       this.getData('vegetables');
       this.getData('legumes');
       this.getData('meat');
       this.getData('milk');
       this.getData('others');

      render() 
      return (//Render components)


      Im rendering components with array located in state. But its return null because app rendering components before query ends. I searched yesterday. i guess i should use promises but i failed to use that. Could you help me?






      firebase react-native google-cloud-firestore expo







      share|improve this question















      Im making an app by using react native and firestore.
      Here a piece of my code;



      getData(mat)
       let count = 0;
       let val;
      db.collection("Yemek").doc("Materials").collection(mat).get().then((querySnapshot) => 
       querySnapshot.forEach((doc) => 
       count++;
       val = doc.data().value;
       matKey = mat+count.toString();
       this.state.array.push([
       meal=mat, value=val, status=false, key=matKey 
       ]);
       );
      ).catch(err => 
       console.log('Error getting documents', err);
       return false;
       );

      componentWillMount()
       this.getData('vegetables');
       this.getData('legumes');
       this.getData('meat');
       this.getData('milk');
       this.getData('others');

      render() 
      return (//Render components)


      Im rendering components with array located in state. But its return null because app rendering components before query ends. I searched yesterday. i guess i should use promises but i failed to use that. Could you help me?






      firebase react-native google-cloud-firestore expo




      firebase react-native google-cloud-firestore expo






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 11 at 14:53

























      asked Nov 10 at 22:46









      Cem Kocagöz

      12




      12



























          active

          oldest

          votes











          Your Answer






          StackExchange.ifUsing("editor", function ()
          StackExchange.using("externalEditor", function ()
          StackExchange.using("snippets", function ()
          StackExchange.snippets.init();
          );
          );
          , "code-snippets");

          StackExchange.ready(function()
          var channelOptions =
          tags: "".split(" "),
          id: "1"
          ;
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function()
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled)
          StackExchange.using("snippets", function()
          createEditor();
          );

          else
          createEditor();

          );

          function createEditor()
          StackExchange.prepareEditor(
          heartbeatType: 'answer',
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader:
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          ,
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          );



          );













           

          draft saved


          draft discarded


















          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53244173%2freact-native-firestore-wait-render-until-query-ends%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown






























          active

          oldest

          votes













          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes















           

          draft saved


          draft discarded















































           


          draft saved


          draft discarded














          StackExchange.ready(
          function ()
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53244173%2freact-native-firestore-wait-render-until-query-ends%23new-answer', 'question_page');

          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Lwg 4UCEI4Qu UuNGixz5Y2nYKpWMEUJzWgjv97OkdHCDYddgCxbFa REkcrb 1Hlgkfnz14oCA39MXv3N1p5xmb3gF5LYZ
          -
          QYSZNnbHFB4b6FNJOrjpraK

          這個網誌中的熱門文章

          How to read a connectionString WITH PROVIDER in .NET Core?

          圖片
          6 I added .AddJsonFile("Connections.json", optional: true, reloadOnChange: true) in public Startup(IHostingEnvironment env) Connections.json contains: "ConnectionStrings": "DefaultConnection": "Server=(localdb)\mssqllocaldb;Database=DATABASE;Trusted_Connection=True;MultipleActiveResultSets=true", "COR-W81-101": "Data Source=DATASOURCE;Initial Catalog=P61_CAFM_Basic;User Id=USERID;Password=PASSWORD;Persist Security Info=False;MultipleActiveResultSets=False;Packet Size=4096;", "COR-W81-100": "Data Source=DATASOURCE;Initial Catalog=Post_PS;User Id=USERID;Password=PASSWORD;Persist Security Info=False;MultipleActiveResultSets=False;Packet Size=4096;", "MSEDGEWIN10": "Data Source=DATASOURCE; Initial Catalog=COR_Basic; Persist Security Info=False;Integrated Security=true;MultipleActiveResultSets=False;Packet Size=4096;Application Name="COR_Basic"", "server...
          閱讀完整內容

          Spillway

          圖片
          Chute spillway of Llyn Brianne dam in Wales A spillway is a structure used to provide the controlled release of flows from a dam or levee into a downstream area, typically the riverbed of the dammed river itself. In the United Kingdom, they may be known as overflow channels . Spillways ensure that the water does not overflow and damage or destroy the dam. Floodgates and fuse plugs may be designed into spillways to regulate water flow and reservoir level. Such a spillway can be used to regulate downstream flows – by releasing water in small amounts before the reservoir is full, operators can prevent sudden large releases that would happen if the dam were overtopped. Other uses of the term "spillway" include bypasses of dams or outlets of channels used during high water, and outlet channels carved through natural dams such as moraines. Water normally flows over a spillway only during flood periods – when the reservoir cannot hold the excess of water entering the reservoir ove...
          閱讀完整內容

          A major

          圖片
          A major Relative key F-sharp minor Parallel key A minor Dominant key E major Subdominant D major Component pitches A, B, C ♯ , D, E, F ♯ , G ♯ A major (or the key of A ) is a major scale based on A, with the pitches A, B, C ♯ , D, E, F ♯ , and G ♯ . Its key signature has three sharps. Its relative minor is F-sharp minor and its parallel minor is A minor. The key of A major is the only key where a Neapolitan sixth chord on 2^displaystyle hat 2 requires both a flat and a natural accidental. The A major scale is: override Score.TimeSignature #'stencil = "##f" relative c'' clef treble key a major time 7/4 a4 b cis d e fis gis a gis fis e d cis b a2 "/> In the treble, alto, and bass clefs, the G ♯ in the key signature is placed higher than C ♯ . However, in the tenor clef, it would require a ledger line and so G ♯ is placed lower than C ♯ . Contents 1 History 2 Notable compositions in A major 3 See also 4 References 5 Fur...
          閱讀完整內容