nuxtProject/pages/test/index.vue

<template>
  <div>
    {{counter}}
    <hr>
    <el-button @click="addFun">add</el-button>
    <el-button @click="minFun">min</el-button>

    <myChildPage></myChildPage>
  </div>
</template>

<script>
  import myChildPage from '~/components/test/myChildPage';
  import Vue          from 'vue';
  const myData = Vue.observable({count: 1})
  export default {
    name: 'test',
    provide: {
      testData: myData
    },
    components: {
      myChildPage
    },
    head() {
      return {
        title: '测试',
        meta: [
          {
            hid: 'description',
            name: 'description',
            content: '我的测试'
          }
        ]
      }
    },
    computed: {
      counter() {
        return myData.count
      }
    },
    methods: {
      addFun() {
        myData.count++;
      },
      minFun() {
        myData.count--;
      },
    }
  };
</script>

<style scoped>

</style>