<template>
  <div>
    共享值：{{count}}<br/>
    <el-button @click="countAdd">count++</el-button>
  </div>
</template>

<script lang="ts">
  import {
    defineComponent,
    onMounted,
    ref,
    toRefs,
    reactive,
    watch,
    getCurrentInstance,
    ComponentInternalInstance,
    computed,
  } from "vue";

  export default defineComponent({
    name: "",
    components: {
    },
    props: {
      disabled: {}
    },
    setup() {
      const that = (getCurrentInstance() as ComponentInternalInstance).appContext.config.globalProperties;
      const state = reactive({
        count: 0
      });
      const countAdd = () => {
        localStorage.setItem('count', localStorage.getItem('count') ? Number(localStorage.getItem('count')) + 1 : 0)
      }
      window.addEventListener('storage', (e: any) => {
        console.log(e)
        if (e.key === 'count') {
          // 刷新列表
        }
      })
      onMounted(() => {
      })
      return {
        ...toRefs(state),
        countAdd
      }
    },
  });
</script>
<style scoped lang="scss">
</style>
