asp的web音乐网站设计个人博客搭建

需求：使用uniapp，模拟key（表名）增删改查对象数组，每个key可以单独操作，并模拟面对对象对应表，每个key对应的baseInstance 类似一个操作类，当然如果你场景比较简单，可以改为固定key或者传值key，调普通js而不需要new

base.js

export default {data() {return {}},methods: {// 一是不需要new来调用，二是参数非常灵活，可以不传，也可以这么传createBaseStore(key) {return new this.baseInstance(key || {})},// 函数创建对象 每个key对应自己的方法 达到实例化效果 使用 baseInstance.addExt(obj) 自动携带固定keybaseInstance(key) {this.dataKey = key;this.addExt = function addExt(obj) {var dataList = this.getAllExt()if (dataList == null) {dataList = new Array()}var newItemid = 0const last = dataList.length - 1if (last >= 0) {newItemid = dataList[last].id + 1}obj.id = newItemiddataList.push(obj)this.save(dataList)}this.removeExt = function removeExt(param) {var dataList = this.getAllExt();var findItemIndex = dataList.findIndex(item => {if (item.id == param) {return true}})if (findItemIndex >= 0) {const newList = dataList.splice(findItemIndex, 1)console.log("remove item is index", findItemIndex, JSON.stringify(newList))this.save(dataList)} else {console.log("not find remove param", param)}}this.changeExt = function changeExt() {console.log("change")}this.searchExt = function searchExt() {console.log("search")}this.save = function save(dataList) {var dataJson = JSON.stringify(dataList)uni.setStorage({key: key,data: dataJson,success: function() {console.log("key:", key, 'addExt success', dataJson);console.log('curr size', dataList.length);}});}this.getAllExt = function getAllExt() {try {const value = uni.getStorageSync(this.dataKey);if (!value) {console.log('getAllExt is empty');return null}const dataBean = JSON.parse(value)if (dataBean) {return dataBean}} catch (e) {console.log("showAllToLogExt error", e);}return null}this.showAllToLogExt = function showAllToLogExt() {try {const value = this.getAllExt();if (value) {console.log("showAllToLogExt", value);}} catch (e) {console.log("showAllToLogExt error", e);}}},clearAllExt() {console.log("clearAllExt")uni.clearStorage()}}}

vue使用

<template><view><view class="uni-flex uni-row" style="-webkit-justify-content: center;justify-content: center;"><button type="default" v-on:click="showAllToLog()">showAllToLog</button><button type="default" v-on:click="add()">add</button><button type="default" v-on:click="remove()">remove</button><button type="default" v-on:click="change()">change</button><button type="default" v-on:click="search()">search</button><button type="default" v-on:click="clearAll()">clearAll</button></view></view>
</template><script>import base from "@/pages/base/base.js"export default {mixins: [base],data() {return {title: 'demo学习',TestBean: {id: 0,a: "",b: "",c: "",},dataExt: {},dataExt2: {},storeInstance1: this.createBaseStore("key111"),storeInstance2: this.createBaseStore("key222"),indexId: 0}},onload() {getAllExt()},methods: {showAllToLog() {this.storeInstance1.showAllToLogExt()this.storeInstance2.showAllToLogExt()},add() {// 操作类型1实例 ，存对象2到对象数组2var currentTime = new Date();this.dataExt.name = "111"this.dataExt.goodsTime = currentTimethis.storeInstance1.addExt(this.dataExt)// key1Store.remove// key1Store. 等等操作// 操作类型2实例 ，存对象2到对象数组2this.dataExt2.name = "param2"this.dataExt2.param2Time = currentTimethis.storeInstance2.addExt(this.dataExt2)},remove() {// 模拟后续加上id即可目前只是掩饰this.storeInstance1.removeExt(4)this.storeInstance2.removeExt(4)},change() {this.changeExt()},search() {this.searchExt()},clearAll() {this.clearAllExt()},}}
</script><style></style>