index.js 4.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126
  1. // nova-werun/components/circle/index.js
  2. Component({
  3. /**
  4. * 组件的属性列表
  5. */
  6. properties: {
  7. },
  8. /**
  9. * 组件的初始数据
  10. */
  11. data: {
  12. //屏幕高度
  13. statusBarHeight: 0, // 状态栏高度
  14. screenHeight: 0, // 屏幕高度
  15. customHeight: 0, // 自定义导航栏高度(如小程序右上角胶囊按钮)
  16. bottomNavHeight: 0, // 底部导航栏高度
  17. contentHeight: 0, // 可用内容高度
  18. contentHeight2: 0,
  19. contentpadding: 0, //顶部padding高度
  20. //图片
  21. images: [
  22. 'http://img2.baidu.com/it/u=2324169262,1340424811&fm=253&app=138&f=JPEG?w=800&h=1422',
  23. 'https://img2.baidu.com/it/u=2814429148,2262424695&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1422',
  24. 'https://img2.baidu.com/it/u=2814429148,2262424695&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1422',
  25. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  26. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  27. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  28. 'https://img2.baidu.com/it/u=2814429148,2262424695&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1422',
  29. 'https://img2.baidu.com/it/u=2814429148,2262424695&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=1422',
  30. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  31. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  32. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  33. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  34. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  35. 'https://inews.gtimg.com/om_bt/OE8piEBa-tbqn-wNvWZl8coi4AlzoUD43upEkoAnIkYL8AA/641',
  36. ],
  37. imageclass:'',
  38. //是否展示点赞评论按钮
  39. isgood:false,
  40. isclick:false,
  41. },
  42. lifetimes: {
  43. detached: function () {
  44. // 在组件实例被从页面节点树移除时执行
  45. },
  46. attached: async function () {
  47. // 在组件实例进入页面节点树时执行
  48. // 计算
  49. const systemInfo = wx.getSystemInfoSync();
  50. const statusBarHeight = systemInfo.statusBarHeight || 0;
  51. const screenHeight = systemInfo.screenHeight || 0;
  52. const custom = wx.getMenuButtonBoundingClientRect();
  53. const customHeight = custom.height + 10 + 2 || 0;
  54. const bottomNavHeight = systemInfo.screenHeight - systemInfo.safeArea.bottom || 0;
  55. const contentpadding = (statusBarHeight + customHeight) * 750 / systemInfo.windowWidth;
  56. const contentHeight = (screenHeight - bottomNavHeight - 50) * 750 / systemInfo.windowWidth;
  57. const contentHeight2 = (screenHeight - bottomNavHeight - 50 - statusBarHeight - customHeight) * 750 / systemInfo.windowWidth;
  58. this.setData({
  59. statusBarHeight,
  60. screenHeight,
  61. customHeight,
  62. bottomNavHeight,
  63. contentHeight,
  64. contentpadding,
  65. contentHeight2
  66. });
  67. console.log('123', contentHeight, contentHeight2);
  68. },
  69. },
  70. /**
  71. * 组件的方法列表
  72. */
  73. methods: {
  74. onImageLoad: function (e) {
  75. const {
  76. width,
  77. height
  78. } = e.detail; // 获取图片的宽高
  79. console.log('11', e.detail);
  80. const imageClass = width > height ? 'image-landscape' : 'image-portrait'; // 判断横竖屏
  81. this.setData({
  82. imageclass: imageClass // 动态设置图片的类名
  83. });
  84. },
  85. previewImage: function(e) {
  86. const index = e.currentTarget.dataset.index; // 获取当前点击图片的索引
  87. const images = this.data.images; // 获取所有图片的链接
  88. wx.previewImage({
  89. current: images[index], // 当前显示图片的链接
  90. urls: images // 需要预览的图片链接列表
  91. });
  92. },
  93. gourl(e){
  94. const url = e.currentTarget.dataset.url
  95. wx.navigateTo({
  96. url: url // 目标页面的路径
  97. });
  98. },
  99. showgood(){
  100. this.setData({
  101. isgood:!this.data.isgood
  102. })
  103. console.log(this.data.isgood);
  104. },
  105. isclick(){
  106. this.setData({
  107. isclick:!this.data.isclick
  108. })
  109. setTimeout(()=>{
  110. this.showgood()
  111. },400)
  112. console.log(this.data.isclick);
  113. }
  114. }
  115. })