tag标签迁移

pages/common/dynamic/dynamic-items.vue

@@ -48,14 +48,8 @@
 
         </view>
         <view class="data-tag-list" 	>
-          <view class="data-tag" v-for="tag in item.tag" :style="{'background':tagBg}">
-<!--            <image  class="data-tag-img"   mode="aspectFill" :src="tag.icon" ></image>-->
-            <view class="data-tag-icon">
-              <text class="iconfont icon-dingweixiao" v-if="tag.icon==='1'"  :style="{'color':tagColor}"> &#xe87e;</text>
-              <text class="iconfont icon-canyuhuati" v-else  :style="{'color':tagColor}"> &#xe61e;</text>
-            </view>
-            <view class="data-tag-text  sys-weight-400"  :style="{'color':tagColor}">{{tag.text}}</view>
-          </view>
+          <dynamic-tag :list="item.tag" :tag-bg="tagBg" :tag-color="tagColor"></dynamic-tag>
+
         </view>
         <view class="data-operation">
           <view class="operation-item" @click="setLike(itemIndex)">
@@ -83,9 +77,10 @@
 import ImgOne from "@/pages/common/img/img-one";
 import ImgTwo from "@/pages/common/img/img-two";
 import ImgThree from "@/pages/common/img/img-three";
+import DynamicTag from "@/pages/common/tag/dynamic-tag";
 export default {
   name: "dynamic-items",
-  components: {ImgThree, ImgTwo, ImgOne},
+  components: {DynamicTag, ImgThree, ImgTwo, ImgOne},
   props: {
       textColor:{
         type:String,
@@ -216,38 +211,6 @@ export default {
       }
       .data-tag-list{
         margin-top: 28rpx;
-        display: flex;
-        flex-wrap: wrap;
-        .data-tag{
-          margin-top: 26rpx;
-          margin-right: 20rpx;
-          border-radius: 200rpx;
-          background: rgba(255,255,255,0.4);
-          display: flex;
-          justify-content: center;
-          padding: 4rpx 12rpx;
-          .data-tag-img{
-            width: 32rpx;
-            height: 32rpx;
-            margin-right: 8rpx;
-          }
-          .data-tag-icon{
-            width: 32rpx;
-            height: 32rpx;
-            margin-right: 8rpx;
-            text-align: center;
-            line-height: 32rpx;
-            text{
-              font-size: 28rpx;
-              line-height: 32rpx;
-            }
-          }
-          .data-tag-text{
-            font-size: 24rpx;
-            height: 32rpx;
-            line-height: 32rpx;
-          }
-        }
       }
       .data-operation{
         margin-top: 40rpx;

pages/common/tag/dynamic-tag.vue

@@ -0,0 +1,85 @@
+<template>
+  <view class="tag-box">
+    <view class="tag-box-list">
+      <view class="data-tag" v-for="tag in list" :style="{'background':tagBg}">
+        <!--            <image  class="data-tag-img"   mode="aspectFill" :src="tag.icon" ></image>-->
+        <view class="data-tag-icon">
+          <text class="iconfont icon-dingweixiao" v-if="tag.icon==='1'"  :style="{'color':tagColor}"> &#xe87e;</text>
+          <text class="iconfont icon-canyuhuati" v-else  :style="{'color':tagColor}"> &#xe61e;</text>
+        </view>
+        <view class="data-tag-text  sys-weight-400"  :style="{'color':tagColor}">{{tag.text}}</view>
+      </view>
+    </view>
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "dynamic-tag",
+  components: {},
+  props: {
+    list:{
+      type:Array,
+      default:[]
+    },
+    tagColor:{
+      type:String,
+      default:'#282828'
+    },
+    tagBg:{
+      type:String,
+      default:'rgba(255,255,255,0.4)'
+    },
+  },
+  data() {
+    return {}
+  },
+  watch: {},
+  mounted() {
+
+  },
+  methods: {}
+}
+</script>
+
+<style scoped lang="scss">
+.tag-box{
+  .tag-box-list{
+
+    display: flex;
+    flex-wrap: wrap;
+    .data-tag{
+      margin-top: 26rpx;
+      margin-right: 20rpx;
+      border-radius: 200rpx;
+      background: rgba(255,255,255,0.4);
+      display: flex;
+      justify-content: center;
+      padding: 4rpx 12rpx;
+      .data-tag-img{
+        width: 32rpx;
+        height: 32rpx;
+        margin-right: 8rpx;
+      }
+      .data-tag-icon{
+        width: 32rpx;
+        height: 32rpx;
+        margin-right: 8rpx;
+        text-align: center;
+        line-height: 32rpx;
+        text{
+          font-size: 28rpx;
+          line-height: 32rpx;
+        }
+      }
+      .data-tag-text{
+        font-size: 24rpx;
+        height: 32rpx;
+        line-height: 32rpx;
+      }
+    }
+  }
+}
+
+</style>

pages/my/index.vue

@@ -102,6 +102,9 @@
           <view class="my-dynamic" v-if="tagNum===0">
             <dynamic-items text-color="#141414" operate-color="#999999" tag-color="#999999" tag-bg="#F2F2F2" division-color="#F2F2F2" :show-add="true"></dynamic-items>
           </view>
+          <view class="my-praise">
+
+          </view>
         </view>
 
       </scroll-view>

pages/my/model/my-praise.vue

@@ -0,0 +1,27 @@
+<template>
+  <view>
+
+  </view>
+</template>
+
+<script>
+export default {
+  name: "my-praise",
+  components: {},
+  props: {},
+  data() {
+    return {}
+  },
+  watch: {},
+  mounted() {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style scoped lang="scss">
+
+</style>