1.diy---- 用户信息开发

components/diy/auxiliary-line.vue

@@ -1,8 +1,7 @@
 <template>
-    <view>
-        <view :style="style_container">
-            <view :style="style"></view>
-        </view>
+    <!-- 横线 -->
+    <view :style="style_container">
+        <view :style="style"></view>
     </view>
 </template>
 

components/diy/footer.vue

@@ -1,4 +1,5 @@
 <template>
+    <!-- 底部导航 -->
     <view class="footer-nav flex-row jc-c align-c bottom-line-exclude">
         <view class="footer-nav-content flex-row jc-c align-c wh" :style="style_container">
             <ul class="flex-row jc-sa align-c wh padding-0">

components/diy/rich-text.vue

@@ -1,4 +1,5 @@
 <template>
+    <!-- 富文本 -->
     <view class="rich-text" :style="style_container">
         <mp-html :content="content" />
     </view>

components/diy/user-info.vue

@@ -0,0 +1,43 @@
+<template>
+    <!-- 用户信息 -->
+    <view class="rich-text" :style="style_container">
+        <mp-html :content="content" />
+    </view>
+</template>
+
+<script>
+    import { common_styles_computer } from '@/common/js/common/common.js';
+    export default {
+        props: {
+            value: {
+                type: Object,
+                default: () => ({}),
+            },
+        },
+        data() {
+            return {
+                style_container: '',
+                content: '',
+            };
+        },
+        mounted() {
+            this.init();
+        },
+        methods: {
+            init() {
+                const new_content = this.value.content || {};
+                const new_style = this.value.style || {};
+                this.content = new_content.html;
+                this.style_container = common_styles_computer(new_style.common_style);
+            },
+        },
+    };
+</script>
+
+<style>
+    .rich-text {
+        * {
+            max-width: 100%;
+        }
+    }
+</style>