vueuse 中文文档

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>
Catalog
vueuse 入门 State 状态 createGlobalState 全局状态 createInjectionState 组件传值 createSharedComposable useAsyncState 异步响应式 useDebouncedRefHistory useLastChanged 最后修改时间 useLocalStorage 响应式存储 useManualRefHistory useRefHistory 历史快照 useStorageAsync useSessionStorage 响应式存储 useStorage 响应式存储 useThrottledRefHistory Elements 元素 Browser 浏览器 Sensors 感应监测