richtext.vue 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667
  1. <!-- 文章展示 -->
  2. <template>
  3. <s-layout class="set-wrap" :title="state.title" :bgStyle="{ color: '#FFF' }" v-if="state.title && !type">
  4. <view class="ss-p-30">
  5. <mp-html class="richtext" :content="state.content" />
  6. </view>
  7. </s-layout>
  8. <mp-html class="richtext" :content="state.content" v-else/>
  9. </template>
  10. <script setup>
  11. import { onLoad } from '@dcloudio/uni-app';
  12. import { reactive,defineProps } from 'vue';
  13. import ArticleApi from '@/sheep/api/promotion/article';
  14. const state = reactive({
  15. title: '',
  16. content: '',
  17. });
  18. async function getRichTextContent(id, title) {
  19. console.log(id,title)
  20. const { code, data } = await ArticleApi.getArticle(id, title);
  21. if (code !== 0) {
  22. return;
  23. }
  24. state.content = data.content;
  25. // 标题不一致时,修改标题
  26. if (state.title !== data.title) {
  27. state.title = data.title;
  28. uni.setNavigationBarTitle({
  29. title: state.title,
  30. });
  31. }
  32. }
  33. const props = defineProps({
  34. title:{
  35. defautls:'',
  36. type:String
  37. },
  38. type:{
  39. defautls:'',
  40. type:String
  41. }
  42. })
  43. onLoad((options) => {
  44. if (options.title || props.title) {
  45. state.title = options.title || props.title;
  46. uni.setNavigationBarTitle({
  47. title: state.title || props.title,
  48. });
  49. }
  50. getRichTextContent(options.id, options.title||props.title);
  51. });
  52. </script>
  53. <style lang="scss" scoped>
  54. .set-title {
  55. margin: 0 30rpx;
  56. }
  57. .richtext {
  58. }
  59. </style>