title: svelte: how can a component modify a variable/object on its parent?
body: <p>I have a main application that contains the user object and the login component</p>
  <pre><code>&lt;script&gt;
  let user = {}
  &lt;/script&gt;
  
  hello {user.username}
  &lt;login user={user} /&gt;
  </code></pre>
  <p>In the login component, I make a call to ajax and receive some data like:</p>
  <pre><code>user = {id:1, username:&quot;john&quot;}
  </code></pre>
  <p>How can I then  &quot;inform&quot; the main application I have updated the user so it displays hello john</p>
  <p>For now, I dispatch an event</p>
  <pre><code>import { createEventDispatcher } from 'svelte';
  const dispatch = createEventDispatcher();
  </code></pre>
  <p>Is there a better way to achieve that ?</p>