title: Svelte Tabs - Don't reload / destroy data
body: <p>I am using a svelte tabs component that is described here: </p>
  
  <p><a href="https://svelte.dev/repl/8e68120858e5322272dc9136c4bb79cc?version=3.5.1" rel="nofollow noreferrer">https://svelte.dev/repl/8e68120858e5322272dc9136c4bb79cc?version=3.5.1</a></p>
  
  <p>Inside two tabs I have the following svelte template code:</p>
  
  <pre><code>&lt;TabPanel&gt;
      &lt;Filter/&gt;
      &lt;div id='to-filter' class='scroll-container'&gt;
          {#each value.items as item, i}
                  &lt;Item 
                  itemFilter={item.name}  
                  itemDay={item.itemDay} 
                  itemMonth={item.itemMonth} 
                  itemYear={item.itemYear} 
                  itemCity={item.itemCity} 
                  itemCountry={item.itemCountry} 
                  itemVenue={item.venue}
                  itemLink={item.link}
                  itemDotw={itemDatesOnly[i].itemDotw}
                  /&gt;
          {/each}
      &lt;/div&gt;
  &lt;/TabPanel&gt;
  </code></pre>
  
  <p>Every time I click on the tabs to switch between the data, it seems to reload or rebuild it. How can I adjust the tab component so that it's not destroying the data each time?</p>