index.vue 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566
  1. <template>
  2. <view>
  3. <view class="">
  4. <view class="margin-lr margin-top" style="position: relative;border-radius: 10upx;overflow: hidden;">
  5. <image :src="image" style="width: 100%;height: 467px;" @click="clickImg"></image>
  6. </view>
  7. </view>
  8. </view>
  9. </template>
  10. <script>
  11. export default {
  12. data() {
  13. return {
  14. image:'',
  15. }
  16. },
  17. onLoad(option) {
  18. console.log(option.tu)
  19. this.image=option.tu
  20. },
  21. methods: {
  22. //点击放大图片
  23. clickImg(){
  24. wx.previewImage({
  25. urls: [this.image], //需要预览的图片http链接列表,多张的时候,url直接写在后面就行了
  26. current:'', // 当前显示图片的http链接,默认是第一个
  27. success: function(res) {},
  28. fail: function(res) {},
  29. complete: function(res) {},
  30. })
  31. },
  32. },
  33. computed: {
  34. }
  35. }
  36. </script>
  37. <style>
  38. .bg {
  39. background-color: #FFFFFF;
  40. }
  41. .btn {
  42. width: 100%;
  43. height: 88upx;
  44. background: linear-gradient(0deg, #af8262 0%, #cab49c 100%);
  45. border-radius: 44upx;
  46. text-align: center;
  47. line-height: 88upx;
  48. margin-top: 40upx;
  49. font-size: 34upx;
  50. font-weight: 600;
  51. color: #402321;
  52. }
  53. .active {
  54. border: 1px solid #cab49c !important;
  55. border-radius: ;
  56. }
  57. </style>