Part1用Vue3.0 开发一款导入浏览器书签的在线书签( 二 ) _书签

2、原生Input文件上传-隐藏input标签，实现点击上传

// 导入书签const importBookmark = () => {const file = document.getElementById('file')file.dispatchEvent(new MouseEvent('click'))const mybookmark = document.getElementById('mybookmark')document.getElementById('file').addEventListener('change', function () {var file = document.getElementById('file').files[0]var reader = new FileReader()reader.readAsText(file, 'utf-8')reader.onload = function () {mybookmark.innerHTML = reader.resultconst formDatas = JSON.stringify(walkBookmarksTree(mybookmark))//此处已经获取了我们上传的bookmark.html文件的内容了，并且已经格式化})} else {ElMessage.warning('请先登录')}}
3、接入实现数据存储
其实这部分我已经进行了简单的函数封装，用起来是很方便的，还有很多用法可以参考文档,具体用法是非常详细的。
其实使用下面几个封装的函数，基本就可以实现一个系统的增删改查了，还是非常快速方便的。数据以JSON数据格式进行存储。
4.1 对象存储公共函数（传入表名和存储的数据）
import AV from 'leancloud-storage'// 对象存储公共函数export const saveObject = (className, params) => {return new Promise((resolve, reject) => {const Todo = AV.Object.extend(className)const user = AV.User.current()var todo = new Todo()todo.set('formDatas', params.formDatas)todo.set('user', user)todo.save().then((res) => {resolve(res)}, (error) => {reject(error)})})}
4.2 获取对象存储的列表数据（传入表名和条件）
// 获取对象列表export const getObject = (className, params) => {return new Promise((resolve, reject) => {const query = new AV.Query(className)// 查询多个条件const user = AV.User.current()for (const v in params) {if (params[v]) {query.equalTo(v, params[v])}}query.equalTo('user', user)query.find().then((res) => {resolve(res)}, (error) => {reject(error)})})}
4.3 删除对象数据（传入表名和数据ID）
// 删除对象export const deleteObject = (className, id) => {return new Promise((resolve, reject) => {const todo = AV.Object.createWithoutData(className, id)todo.destroy().then((res) => {resolve(res)}, (error) => {reject(error)})})}
4.4 更新对象数据（传入表名和存的数据+ID）
// 更新对象export const updateObject = (className, params) => {return new Promise((resolve, reject) => {const todo = AV.Object.createWithoutData(className, params.id)for (var i in params) {todo.set(i, params[i])}todo.save().then((res) => {resolve(res)}, (error) => {reject(error)})})}
issue
需要什么新的需求或者设计，可以给我提issue,感谢，喜欢的也可以点个赞。
致谢
感谢【空白i】的打赏【66.6】继续加油，希望可以做出更多更精致开源的作品处理。继续加油。
其他链接