VueUse useLastChanged 最后一次修改时间

VueUse useLastChanged 可以记录最后一次修改时间,如果你新赋的值和没有变化,是不会记录时间的,比如原有的值等于123,再次赋值123,不会记录这次修改时间。

代码示例

import { ref ,reactive} from 'vue'
import { useLastChanged } from '@vueuse/core'

const counter = ref(0);
const useInfo = reactive({id:0})
// ref 对象修改时间
const lastChangedRef = useLastChanged(counter);
// reactive 对象好像也行
const lastChangedReactive = useLastChanged(useInfo);

在线例子

例子

完整代码

<template>
  <div>     
    <p>Ref: {{lastChangedRef }}</p>
    <p>Loading: {{ lastChangedReactive }}</p>
    <button @click="edit">
      点击试试看
    </button> 
  </div>
</template>
<script setup lang="ts">
/*
 vueuse 中文文档
 https://www.itxst.com/vueuse/tutorial.html
*/
import { ref ,reactive} from 'vue'
import { useLastChanged } from '@vueuse/core'

const counter = ref(0);
const useInfo = reactive({id:0})

const lastChangedRef = useLastChanged(counter);
const lastChangedReactive = useLastChanged(useInfo);
 
const edit=()=>{
  counter.value=counter.value+1;
  useInfo.id= useInfo.id+1;
}
</script>