tk-mini-program/pages/Forum/Forum.vue

<template>
  <view class="forum">
    <view class="bg">
      <image
        class="bgImg"
        src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/HomeBackground.png"
        mode="scaleToFill"
      />
    </view>
    <view class="title">站内信</view>
  </view>
  <view class="content">
    <view class="building">
      <view>
        <image
          style="width: 500rpx"
          src="https://vv-1317974657.cos.ap-shanghai.myqcloud.com/util/building.png"
          mode="scaleToFill"
        />
      </view>
      <view class="buildingTitle">暂无数据</view>
    </view>
  </view>
  <view class="tabBar">
    <tabBar :tabIndex="1"></tabBar>
  </view>
</template>

<script>
import tabBar from "../../components/tabBar/tabBar";
export default {
  data() {
    return {
      title: "Hello",
    };
  },
  onShareAppMessage(res) {
    if (res.from === "menu") {
      return {
        title: "分享",
        path: getCurrentPages()[getCurrentPages().length - 1].route,
      };
    }
  },
  onLoad() {
    // 页面加载时执行
  },
  methods: {
    // 方法定义
  },
  components: {
    tabBar,
  },
};
</script>

<style scoped>
.bg {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
}
.bgImg {
  width: 100%;
  height: 100%;
}
.title {
  position: absolute;
  top: 120rpx;
  left: 345rpx;
  font-size: 34rpx;
  color: #100e0f;
  font-weight: bold;
}
/* 建设中 */
.content {
  position: absolute;
  top: 250rpx;
  left: 0rpx;
  right: 0rpx;
  bottom: 100rpx;
}
.building {
  width: 100%;
  height: 90%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.buildingTitle {
  font-size: 40rpx;
  color: #999999;
  font-weight: bold;
  text-align: center;
  margin-top: 50rpx;
}
</style>