Files
ClassContent/历届学生/fontendsix/项目练习/学生项目/王安民/uniapp-project/pages/info/info.vue
2024-09-27 02:06:13 +08:00

76 lines
1.8 KiB
Vue

<template>
<view v-if="list.imgs.length != 0">
<image v-for="(v,i) in list.imgs" :key="i" :src="v" :data-src="v" mode="widthFix" @tap="previewOpen"></image>
<kxj-previewImage ref="previewImage" :imgs="list.imgs" :descs="descs" @longPress="longPress"></kxj-previewImage>
</view>
</template>
<script>
export default {
data() {
return {
id:'',
list:{
imgs:[]
}
}
},
methods: {
async getInfo() {
this.list = await this.$http.index.getInfo({
id:this.id,
});
console.log(this.list)
},
previewOpen(e) {
var param = e.currentTarget.dataset.src;
console.log(param);
this.$refs.previewImage.open(param); // 传入当前选中的图片地址或序号
return; //如需测试和uni原生预览差别可注释这两行
//以下是效果对比相关
var _this = this;
uni.showModal({
title: '请选择',
content: '请选择使用uni原生图片预览或非原生自定义的图片预览。',
cancelText: 'uni',
confirmText: '自定义',
success: function(res) {
if (res.confirm) {
_this.$refs.previewImage.open(param); // 传入当前选中的图片地址或序号
} else if (res.cancel) {
uni.previewImage({
current: param,
urls: _this.imgs
});
}
}
});
},
setTitle(){
if(this.list.length != 0){
uni.setNavigationBarTitle({
title:this.list
})
}
},
onLoad: function (option) {
this.id =option.id;
},
created() {
this.getInfo();
console.log(this.id)
setTitle()
}
}
}
</script>
<style lang="less" scoped>
image {
width: 100%;
}
</style>