ohplay_h5/src/pages/guide/index.vue

<template>
  <view class="app-container">
    <view v-if="content" class="ql-container">
      <rich-text class="ql-editor" :nodes="content" />
    </view>
    <noData v-else>
      暂无引导内容
    </noData>
    <button type="submit" circle @click="close">知道了</button>
  </view>
</template>

<script>
import { getGuidePageContent } from '@/api/guide'
export default {
  data() {
    return {
      content: ''
    }
  },
  onLoad(e) {
    getGuidePageContent({
      clientType: e.deviceModel
    }).then(res => {
      if (res.data.code === 0) {
        this.content = res.data.data.guidePageContent
      }
    })
  },
  methods: {
    close() {
      closePage.postMessage('关闭页面')
    }
  }
}
</script>

<style lang="scss" scoped>
.app-container {
  height: 100%;
}

.ql-container {
  height: calc(100% - 106rpx);
  overflow-y: scroll;
}

button {
  position: absolute;
  bottom: 32rpx;
  left: 32rpx;
  width: calc(100% - 64rpx);
}
</style>