content.vue 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <template>
  2. <view class="content">
  3. <view v-html="content"></view>
  4. </view>
  5. </template>
  6. <script>
  7. export default {
  8. data() {
  9. return {
  10. content:"",
  11. }
  12. },
  13. onLoad(val) {
  14. const originalHtml = uni.getStorageSync('content') || '';
  15. this.content = originalHtml.replace(
  16. /<img([^>]*)>/gi,
  17. (match, attrs) => {
  18. // 如果已有 style,追加;没有则新增
  19. const hasStyle = /style\s*=/.test(attrs);
  20. if (hasStyle) {
  21. return match.replace(/style\s*=\s*["']([^"']*)["']/i, (s, old) =>
  22. s.replace(old, old + ';max-width:100%;display:block;')
  23. );
  24. } else {
  25. return `<img${attrs} style="max-width:100%;display:block;">`;
  26. }
  27. }
  28. );
  29. }
  30. }
  31. </script>
  32. <style scoped lang="scss">
  33. page{
  34. height: 100%;
  35. }
  36. .content{
  37. height: 100%;
  38. }
  39. .logo{
  40. padding-top: 15%;
  41. text-align: center;
  42. image{
  43. width: 80px;
  44. height: 80px;
  45. }
  46. p{
  47. margin: 10px 0px;
  48. font-size: 14px;
  49. }
  50. }
  51. .set-box{
  52. margin-top: 30upx;
  53. background: #fff;
  54. padding: 0 40upx;
  55. .item{
  56. display: flex;
  57. align-items: center;
  58. justify-content: space-between;
  59. padding: 25upx 0;
  60. .left{
  61. display: flex;
  62. align-items: center;
  63. .text{
  64. font-size: 30upx;
  65. color: #666;
  66. }
  67. }
  68. .right{
  69. width: 10upx;
  70. height: 20upx;
  71. }
  72. .right-text{
  73. }
  74. }
  75. }
  76. .contact-btn {
  77. display: inline-block;
  78. position: absolute;
  79. width: 100%;
  80. background: salmon;
  81. opacity: 0;
  82. }
  83. </style>