云文档开发笔记-第一周总结
云文档的开发已经一周了，整个文档基本开发完了，与其说是开发完了不如说是已经写好了整个的Demo，以后肯定还要加许多功能的。我想在这里说一下我开发的时候遇到的困难和解决方案。和我学习到了什么。
困难一-使用数组存储，每次改变使用useState改变值，删除值，查找值，几乎都要遍历一遍数组。
我最开始是将文件列表以数组的形式储存在了useState中，对象的形式如下。
export type defaultFiles = {
id:string
title: string
body?: string
isNew?: boolean
path?: string
isLoaded?: boolean
}[]
于是我做了一个大胆的决定，将数组存储改成对象储存，改成了如下的结构。
export type defaultFiles = {
[key:string]: {
id:string
title: string
body?: string
isNew?: boolean
path?: string
isLoaded?: boolean
}
}
其中对象属性的key值就是id值。这样查找id的使用就可以直接defaultFiles.id，删除的时候可以delete defaultFiles[id]，这样就省区了数组每次操作都要遍历的问题。目前我是这样存储的，如果要加上服务器的话，估计还是返回的数组的形式，为此我写了一个函数，将数组转换成对象的形式，且对象参数的key值是id值。
type defaultFilesType = {
id:string
title: string
body?: string
isNew?: boolean
path?: string
isLoaded?: boolean
}[]
export const flattenArr = (arr:defaultFilesType):Object => {
return arr.reduce((map:map,item) => {
map[item.id] = item;
return map;
}, {
})
}
困难二-当软件没打开或者打开，本地目录中的文件被删除、修改、新增该怎么办？
我当时想的就是，我可以在软件中创建文件，但是如果本地的文件被用户故意的修改怎么办呢？
看看我解决的逻辑。
- 第一次进入软件，查看本地目录是否删除，如果删除则重新创建。
- 每当打开软件的时候，注意是打开软件，不包括刷新软件。这时候就读取一下文档的目录，然后生成对象返回，为此我封装了一个hooks，因为软件代码还没公开，这里就不展示主要代码了。
- 使用node来监听目录中文件的变化，例如：当软件打开，本地的文件被用户恶意删除，那么node监听到后就返回用户的操作，新增或删除，这里没有修改，因为修改就相当于删除了一个文件和修改了一个文件。
- 此时我有遇到了一个问题就是，当我在软件里面操作文件的时候，node同样能监听到目录的改变，所以我有写了一个useState来储存文件的名称。例如：文件名列表中有a.md这个文件，当用户本地删除这个文件的时候，我就会判断一下我的useState中是否存在a.md，如果存在那就说明是本地删除的，如果不存在就说明是我通过软件删除的。
我同样为监听目录的node封装了一个hooks。
总结
- 对数组的一些操作有些了解了，例如reduce。
- 学会了封装一下hooks。
- 对React组件间的props通信了解。
- 我明白的最重要的事情就是，写React项目要敢写，不能一开始就考虑这里优化那里优化的，会导致哪里都不太敢写，就写不好了。先写下去，哪里不行了再重构，不能止步不前。