Estoy tratando de apuntar a JSON anidado usando svelte:self y me encuentro con un problema en el que agregar al JSON dará como resultado que se eliminen las entradas recién agregadas si ocurren en la parte inferior del árbol en la estructura JSON. Aquí hay un ejemplo de REPL usando la demostración svelte:self . Claramente me falta algo con la forma en que especifiqué dónde agregar dentro del JSON.
<script> let files = [ { name: 'entry 1', files: [ { name: 'nested entry' } ] }, { name: 'entry 2' } ]; function add() { files = files.concat({name: 'new item'}) } </script> <ul> {#each files as file} <li> {#if file.files} <svelte:self {...file}/> {:else} <File {...file}/> {/if} </li> {/each} <li> <button on:click={() => add()}>new</button> </li> </ul>En lugar de distribuir los accesorios en <svelte:self {...file}> configurarlos por separado y agregar 'bind:' a los archivos allí y en la etiqueta principal <Folder ..> parece resolver las eliminaciones no deseadas -> [REPL ] ( https://svelte.dev/repl/dfc42f18f777472bb2b1033f6b077c67?version=3.44.1 )
<Folder name="Home" bind:files={root} expanded/> <svelte:self name={file.name} bind:files={file.files}/>