文件
OmniCard/mpuniapp/pages/API/storage/storage.uvue

526 行
14 KiB
Plaintext

<template>
<!-- #ifdef APP && !VUE3-VAPOR -->
<scroll-view class="page-scroll-view">
<!-- #endif -->
<view>
<page-head :title="data.title"></page-head>
<view class="uni-common-mt">
<view class="uni-list">
<view class="uni-list-cell uni-list-cell-line">
<view class="uni-list-cell-left">
<view class="uni-label">key</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" placeholder="请输入key" name="key" :value="data.key" :maxlength="-1"
@input="keyChange" />
</view>
</view>
<view class="uni-list-cell">
<view class="uni-list-cell-left">
<view class="uni-label">value</view>
</view>
<view class="uni-list-cell-db">
<input class="uni-input" type="text" placeholder="请输入value" name="data"
:value="typeof data.data === 'string' ? data.data : JSON.stringify(data.data)" :maxlength="-1" @input="dataChange" />
</view>
</view>
</view>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button class="uni-btn btn-getStorageInfoASync" type="primary" @tap="getStorageInfo">
获取存储概述信息-异步
</button>
<button class="uni-btn btn-getStorageInfoSync" @tap="getStorageInfoSync">
获取存储概述信息-同步
</button>
</view>
<text class="uni-list-cell-db-text">{{ data.storageInfo }}</text>
<view class="uni-row">
<button type="default" style="width:50%" @tap="strMock">
填充字符串
</button>
<button type="default" style="width:50%" @tap="complexMock">
填充复杂对象
</button>
</view>
<view class="uni-row">
<button type="default" style="width:50%" @tap="numberMock">
填充整型
</button>
<button type="default" style="width:50%" @tap="floatMock">
填充浮点型
</button>
</view>
<view class="uni-row">
<button type="default" style="width:50%" @tap="jsonLikeMock">
填充json字符串
</button>
<button type="default" style="width:50%" @tap="longLikeMock">
填充整数字符串
</button>
</view>
<view class="uni-row">
<button type="default" style="width:50%" @tap="floatLikeMock">
填充浮点字符串
</button>
<button type="default" style="width:50%" @tap="negativeLikeMock">
填充负数字符串
</button>
</view>
<view class="uni-row">
<button type="default" class="uni-btn btn-complexStaticTest" style="width:100%" @tap="complexStaticTest">
字面量读写测试
</button>
</view>
</view>
<view class="uni-padding-wrap">
<view class="uni-btn-v">
<button type="primary" class="uni-btn btn-setstorageAsync" @tap="setStorage">
存储数据-异步
</button>
<button class="uni-btn btn-getstorageAsync" @tap="getStorage">读取数据-异步</button>
<button class="uni-btn btn-removeStorageInfoASync" @tap="removeStorage">移除数据-异步</button>
<button class="uni-btn btn-clearStorageInfoASync" @tap="clearStorage">清理数据-异步</button>
</view>
<view class="uni-btn-v">
<button type="primary" class="uni-btn btn-setstorageSync" @tap="setStorageSync">
存储数据-同步
</button>
<button class="uni-btn btn-getstorageSync" @tap="getStorageSync">读取数据-同步</button>
<button class="uni-btn btn-removeStorageInfoSync" @tap="removeStorageSync">
移除数据-同步
</button>
<button class="uni-btn btn-clearStorageInfoSync" @tap="clearStorageSync">
清理数据-同步
</button>
</view>
</view>
</view>
<button type="primary" @click="goto">前往storage管理器</button>
</view>
<!-- #ifdef APP && !VUE3-VAPOR -->
</scroll-view>
<!-- #endif -->
</template>
<script setup lang="uts">
type DataType = {
title: string
key: string
data: any
apiGetData: any | null
storageInfo: string
staticComplexRet: boolean
jest_saveUTSJSONObjectSyncResult: number
jest_saveUTSJSONObjectAsyncResult: number
jest_saveUTSJSONObjectArraySyncResult: number
}
// 使用reactive避免ref数据在自动化测试中无法访问
const data = reactive({
title: 'get/set/clearStorage',
key: '',
data: '',
apiGetData: '',
storageInfo: '',
staticComplexRet: false,
jest_saveUTSJSONObjectSyncResult: 0,
jest_saveUTSJSONObjectAsyncResult: 0,
jest_saveUTSJSONObjectArraySyncResult: 0
} as DataType)
const getStorageInfo = () => {
uni.getStorageInfo({
success: (res) => {
data.apiGetData = res
data.storageInfo = JSON.stringify(res)
},
})
}
const getStorageInfoSync = () => {
try {
const res = uni.getStorageInfoSync()
data.apiGetData = res
data.storageInfo = JSON.stringify(res)
} catch (e) {
// error
console.log(e)
}
}
const jsonLikeMock = () => {
data.key = 'key_' + Math.random()
data.data = JSON.stringify({
name: "james",
age: 12,
from: "american"
});
}
const longLikeMock = () => {
data.key = 'key_' + Math.random()
data.data = "1234567890"
}
const floatLikeMock = () => {
data.key = 'key_' + Math.random()
data.data = "321456.1234567890"
}
const negativeLikeMock = () => {
data.key = 'key_' + Math.random()
data.data = "-321456"
}
const strMock = () => {
data.key = 'key_' + Math.random()
data.data = '测试字符串数据,长度为16个字符'
}
const complexStaticTest = () => {
uni.setStorageSync("key_complexStaticMock", {
name: "张三",
age: 12
})
let savedData = uni.getStorageSync("key_complexStaticMock")
data.staticComplexRet = false
if (savedData instanceof UTSJSONObject) {
if ((savedData as UTSJSONObject).getNumber('age') == 12) {
data.staticComplexRet = true
uni.showToast({
icon: 'success',
title: '测试通过'
})
}
}
}
const complexMock = () => {
data.key = 'key_' + Math.random()
let jsonObj = {
name: '张三',
age: 12,
classMate: [
{
id: 1001,
name: '李四',
},
{
id: 1002,
name: 'jack ma',
},
],
}
data.data = jsonObj
}
const numberMock = () => {
data.key = 'key_' + Math.random()
data.data = 10011
}
const floatMock = () => {
data.key = 'key_' + Math.random()
data.data = 3.1415926535893384626
}
const keyChange = (e : InputEvent) => {
data.key = e.detail.value
}
const dataChange = (e : InputEvent) => {
data.data = e.detail.value
}
const getStorage = () => {
var key = data.key
if (key.length == 0) {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '读取数据失败',
content: 'key 不能为空',
showCancel: false,
})
} else {
uni.getStorage({
key: key,
success: (res) => {
data.apiGetData = res.data
let desc : string = typeof data.apiGetData
if ("object" == desc) {
desc = desc + ": " + JSON.stringify(data.apiGetData)
} else {
desc = desc + ": " + data.apiGetData
}
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '读取数据成功',
content: desc,
showCancel: false,
})
},
fail: () => {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '读取数据失败',
content: '找不到 key 对应的数据',
showCancel: false,
})
},
})
}
}
const getStorageSync = () => {
var key = data.key
if (key.length == 0) {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '读取数据失败',
content: 'key 不能为空',
showCancel: false,
})
} else {
data.apiGetData = uni.getStorageSync(key)
let desc : string = typeof data.apiGetData
if ("object" == desc) {
desc = desc + ": " + JSON.stringify(data.apiGetData)
} else {
desc = desc + ": " + data.apiGetData
}
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '读取数据成功',
content: desc,
showCancel: false,
})
}
}
const setStorage = () => {
var key = data.key
var storageData = data.data
if (key.length == 0) {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '保存数据失败',
content: 'key 不能为空',
showCancel: false,
})
} else {
uni.setStorage({
key: key,
data: storageData,
success: () => {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '存储数据成功',
showCancel: false,
})
},
fail: () => {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '储存数据失败!',
showCancel: false,
})
},
})
}
}
const setStorageSync = () => {
var key = data.key
var storageData = data.data
if (key.length == 0) {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '保存数据失败',
content: 'key 不能为空',
showCancel: false,
})
} else {
uni.setStorageSync(key, storageData)
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '存储数据成功',
showCancel: false,
})
}
}
const removeStorage = () => {
uni.removeStorage({
key: data.key,
success: () => {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '移除数据成功',
showCancel: false,
})
},
fail: () => {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '移除数据失败',
showCancel: false,
})
},
})
}
const removeStorageSync = () => {
uni.removeStorageSync(data.key)
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '移除数据成功',
showCancel: false,
})
}
const clearStorage = () => {
data.key = ''
data.data = ''
uni.clearStorage({
success: function (_) {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '清除数据成功',
showCancel: false,
})
},
fail: function (_) {
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '清除数据失败',
showCancel: false,
})
},
})
}
const clearStorageSync = () => {
data.key = ''
data.data = ''
uni.clearStorageSync()
// #ifndef MP
uni.hideModal({
modalPage:null
})
// #endif
uni.showModal({
title: '清除数据成功',
content: ' ',
showCancel: false,
})
}
const jest_saveUTSJSONObject = () => {
const key = 'test_key_saveUTSJSONObject'
uni.setStorageSync(key, {
a: {
b: 1
}
})
const dataSync = uni.getStorageSync(key) as UTSJSONObject
const dataSyncA = dataSync['a'] as UTSJSONObject
data.jest_saveUTSJSONObjectSyncResult = dataSyncA.get('b') as number
uni.getStorage({
key,
success: (res) => {
const dataAsync = res.data as UTSJSONObject
const dataAsyncA = dataAsync['a'] as UTSJSONObject
data.jest_saveUTSJSONObjectAsyncResult = dataAsyncA.get('b') as number
console.log('data.jest_saveUTSJSONObjectSyncResult: ' + data.jest_saveUTSJSONObjectSyncResult)
console.log('data.jest_saveUTSJSONObjectAsyncResult: ' + data.jest_saveUTSJSONObjectAsyncResult)
}
})
}
const jest_saveUTSJSONObjectArray = () => {
const key = 'test_key_saveUTSJSONObjectArray'
uni.setStorageSync(key, [{
a: 1
}] as UTSJSONObject[])
const dataSync = uni.getStorageSync(key) as UTSJSONObject[]
data.jest_saveUTSJSONObjectArraySyncResult = dataSync[0].get('a') as number
}
const goto = () => {
uni.navigateTo({
url:"/pages/API/storage/storagemanage"
})
}
defineExpose({
data,
jest_saveUTSJSONObject,
jest_saveUTSJSONObjectArray
})
</script>
<style>
</style>