JiangMenCun/webM/src/views/info/component/son5.vue

<!--  -->
<template>
  <div class="son5">
    <One tit="特色物产" :data="data1" @pageNext="$emit('pageNext', 1)" />
    <Three tit="商业集市" :data="data2" @pageNext="$emit('pageNext', 2)" />
    <Three tit="生产工艺" :data="data3" @pageNext="$emit('pageNext', 3)" />
    <Three tit="生产工具" :data="data4" @pageNext="$emit('pageNext', 4)" />
    <One2 tit="服装服饰" :data="data5" @pageNext="$emit('pageNext', 5)" />
    <Three tit="美味美食" :data="data6" @pageNext="$emit('pageNext', 6)" />
    <One2 tit="运输工具" :data="data7" @pageNext="$emit('pageNext', 7)" />
    <One tit="村规民约" :data="data8" @pageNext="$emit('pageNext', 8)" />
    <Four tit="视频集" :data="data9" />
  </div>
</template>

<script>
import { getInfoApi } from "@/utils/api";
import One from "@/components/one.vue";
import One2 from "@/components/one2.vue";
import Three from "@/components/three.vue";
import Four from "@/components/four.vue";
export default {
  name: "son5",
  components: { One, One2, Three,Four },
  props: {},
  data() {
    //这里存放数据
    return {
      data1: {},
      data2: {},
      data3: {},
      data4: {},
      data5: {},
      data6: {},
      data7: {},
      data8: {},
      data9: {},
    };
  },
  //监听属性 类似于data概念
  computed: {},
  //监控data中的数据变化
  watch: {},
  //方法集合
  methods: {},
  //生命周期 - 创建完成（可以访问当前this实例）
  async created() {
    let res = await getInfoApi(Number(this.$route.params.id));
    res.data.forEach((v) => {
      // console.log(v);
      if (v.menuId === 5001) {
        this.data1 = v;
        return;
      } else if (v.menuId === 5002) {
        this.data2 = v;
        return;
      } else if (v.menuId === 5003) {
        this.data3 = v;
        return;
      } else if (v.menuId === 5004) {
        this.data4 = v;
        return;
      } else if (v.menuId === 5005) {
        this.data5 = v;
        return;
      } else if (v.menuId === 5006) {
        this.data6 = v;
        return;
      } else if (v.menuId === 5007) {
        this.data7 = v;
        return;
      } else if (v.menuId === 5008) {
        this.data8 = v;
        return;
      } else if (v.menuId === 5009) {
        this.data9 = v;
        return;
      }
    });
  },
  //生命周期 - 挂载完成（可以访问DOM元素）
  mounted() {},
  beforeCreate() {}, //生命周期 - 创建之前
  beforeMount() {}, //生命周期 - 挂载之前
  beforeUpdate() {}, //生命周期 - 更新之前
  updated() {}, //生命周期 - 更新之后
  beforeDestroy() {}, //生命周期 - 销毁之前
  destroyed() {}, //生命周期 - 销毁完成
  activated() {}, //如果页面有keep-alive缓存功能，这个函数会触发
};
</script>
<style lang='less' scoped>
.son5 {
  width: 100%;
  height: 100%;
}
</style>