[2482] Passed data object becomes Observer for child components, but not page components

I'm new to both Nuxt and Vue.js (double whammy) so sorry if I'm missing something simple, but I seem to have run into an odd behavior with Nuxt when running through some beginner tutorials.

I created this page component in my dev environment

<!-- ./pages/page.vue -->

<template>
  <section class="section is-medium">
    <div class="container has-text-centered">
      <button @click="update">{{ someNumber }}</button>
    </div>
  </section>
</template>

<script>
  function update() {
    data.someNumber++;
    console.log(data);
  }
  var data = {
    someNumber: 1
  };
  export default {
    data: () => data,
    methods: {
        update
    }
  }
</script>

When I load the page up and interact with it, clicking the button will not update the template as I'd expect. However, if I copy this component to be a child component of this page component, it will work...

After some painful debugging I discovered in the console that my data object when passed to the child component is actually modified to become an Observer type, however when viewed inside the page component my data object is just the plain old object I passed in. So I think this is why Vue is missing my updates in the later page component case.

Is this expected behavior? If so, a nice warning in the documentation might be helpful to newcomers like me as I've been operating under the assumption that page components are just extensions of regular components and have the same API (albeit with extensions like asyncData, etc). The fix seems to be using this.someNumber++ which works in both cases, however I'd like to help other fellow newcomers to the project that might run into the same issue if I can, as well as understand the issue more.

Thanks for the project, looks very promising.