短文-常用代码-nodejs之json存储

问题

实际工作中，经常需要写脚本来跑一些临时性功能，这时候就需要一些常用工具类。下面提供一个json常用序列化函数，特点是使用vue响应式原理实现，做到无感主动存储。

函数库说明

fs-extra: 文件存储读取使用

lodash: 常用工具类，此处使用了防抖动函数，防止连续多次存储

@vue/reactivity: 核心，响应式工具类，用于在数据变化时触发存储操作，实际使用effect函数

代码实现

import fs from 'fs-extra'
import { debounce } from 'loadsh'
import { effect, reactive, Ref, ref } from '@vue/reactivity'

// 响应式数据存储，读取json文件，当内容修改时实时保存
export function getJsonFile<T>(p: string): Ref<T> {
  const initData: any = JSON.parse(fs.readFileSync(p).toString('utf-8'))
  const v = ref(reactive(initData))
  const save = debounce((json: any) => fs.writeFileSync(p, JSON.stringify(json, null, '\t'), 'utf-8'), 500)
  effect(() => save(v.value))
  return v as Ref<T>
}

使用说明

import { resolve } from 'path'
import { getJsonFile } from './storage.ts'
const list = getJsonFile(resolve('./list.json'))

list.value.push({
    name: 'Tony',
    age: 24,
})
// 此时会触发响应式，进行数据存储