与牧同行-小程序用户端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

98 lines
2.0 KiB

  1. import http from '../../../utils/api'
  2. const baseUrl = require('../../../utils/baseUrl')
  3. Page({
  4. data: {
  5. baseUrl: baseUrl,
  6. article: {}, // 文章详情
  7. loading: true, // 加载状态
  8. },
  9. onLoad(options) {
  10. this.getArticleDetails(options.id)
  11. },
  12. // 获取文章详情
  13. getArticleDetails(id) {
  14. this.setData({
  15. loading: true
  16. })
  17. http.articleDetails({
  18. data: { id },
  19. success: res => {
  20. console.log('文章详情:', res)
  21. if (res.code === 200 && res.data) {
  22. // 解析富文本内容
  23. const article = res.data
  24. // 这里可以处理富文本内容的样式
  25. article.content = this.formatRichContent(article.content)
  26. this.setData({
  27. article: article,
  28. loading: false
  29. })
  30. // 设置页面标题
  31. wx.setNavigationBarTitle({
  32. title: article.title.substring(0, 10) + (article.title.length > 10 ? '...' : '')
  33. })
  34. } else {
  35. wx.showToast({
  36. title: '文章不存在',
  37. icon: 'error'
  38. })
  39. setTimeout(() => {
  40. wx.navigateBack()
  41. }, 2000)
  42. }
  43. },
  44. fail: err => {
  45. console.error('获取文章详情失败:', err)
  46. this.setData({
  47. loading: false
  48. })
  49. wx.showToast({
  50. title: '加载失败',
  51. icon: 'error'
  52. })
  53. }
  54. })
  55. },
  56. // 格式化富文本内容
  57. formatRichContent(content) {
  58. // 这里可以添加自定义样式,比如给图片添加样式
  59. return content.replace(/<img/g, '<img style="max-width:100%;height:auto;border-radius:15rpx;margin:20rpx 0;"')
  60. },
  61. // 滚动事件
  62. onPageScroll(e) {
  63. this.setData({
  64. scrollTop: e.scrollTop
  65. })
  66. },
  67. // 回到顶部
  68. scrollToTop() {
  69. wx.pageScrollTo({
  70. scrollTop: 0,
  71. duration: 300
  72. })
  73. },
  74. // 下拉刷新
  75. onPullDownRefresh() {
  76. },
  77. // 页面卸载
  78. onUnload() {
  79. }
  80. })