2021-05-08

一，数据缓存

1，uni.setStorage 存储数据

将数据存储在本地缓存中指定的 key 中，只能单条缓存

<template>
	<view>
		<button type="primary" @click="setstorage">存储数据</button>
	</view>
</template>

<script>
	export default {
		methods: {
			setstorage() {
				uni.setStorage({
				 	key: 'id',
				 	data: 100,
				 	success () {
				 		console.log('存储成功')
				 	}
				 })
			}
		}
	}
</script>

2，多条数据缓存

          setstorage(){
				localStorage.setItem('time', 12);
				localStorage.setItem('time1', 34)
				console.log('success');
				uni.setStorage({
						key: 'key',
						data:'hhh',
					    success: function () {
					        console.log('success');
					    }
				})
				 uni.setStorageSync('storage_key', 'hello'); 
			},

localStorage.setItem();uni.setStorage({})，uni.setStorageSync();都可缓存数据。localStorage.setItem()能够多条缓存数据。

3，uni.getStorage 获取数据

<template>
	<view>
		<button type="primary" @click="getStorage">获取数据</button>
	</view>
</template>
<script>
	export default {
		data () {
			return {
				id: ''
			}
		},
		methods: {
			getStorage () {
				uni.getStorage({
					key: 'id',
					success:  res=>{
						this.id = res.data
					}
				})
			}
		}
	}
</script>

4，uni.removeStorage 移除数据

<template>
	<view>
		<button type="primary" @click="removeStorage">删除数据</button>
	</view>
</template>
<script>
	export default {
		methods: {
			removeStorage () {
				uni.removeStorage({
					key: 'id',
					success: function () {
						console.log('删除成功')
					}
				})
			}
		}
	}
</script>

二，上传图片

1，上传，预览图片

<template>
	<view class="content">
        <button type="primary" @click="chooseImg">上传图片</button>
		<image v-for="item in imgArr" :src="item" @click="previewImg(item)" > </image>
	</view>
</template>

<script>
	export default {
		data() {
			return {
                imgArr: []
			}
		},
		onLoad() {

		},
		methods: {
			chooseImg(){
				uni.chooseImage({
				    count: 6, //默认9
				 success: res=>{
					this.imgArr = res.tempFilePaths
				}
				});
			},
			
			previewImg(current){
				console.log(current)
				uni.previewImage({
					current,
					urls:this.imgArr
				})
				
			}
		}
	}
</script>

button产生 “chooseImg"点击事件，在method方法中调用 uni.chooseImage(）方法，上传图片。
设置数组 imgArr ，在imgArr 数组中存放图片，v-for绑定事件 imgArr，通过src 渲染到image界面。
uni.previewImage({ }) 是预览图片，在image中绑定点击事件"previewImg(item)” 。