Son6.vue 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. <!-- -->
  2. <template>
  3. <div class="Son6">
  4. <Four tit="入村路线" :data="data1" @pageNext="$emit('pageNext', 1)" />
  5. <Six tit="村内导览" :data="data2" />
  6. </div>
  7. </template>
  8. <script>
  9. import { getInfoApi } from "@/utils/api";
  10. import Four from "@/components/four.vue";
  11. import Six from "@/components/six.vue";
  12. export default {
  13. name: "Son6",
  14. components: { Four, Six },
  15. props: {},
  16. data() {
  17. //这里存放数据
  18. return {
  19. data1: {},
  20. data2: {},
  21. };
  22. },
  23. //监听属性 类似于data概念
  24. computed: {},
  25. //监控data中的数据变化
  26. watch: {},
  27. //方法集合
  28. methods: {},
  29. //生命周期 - 创建完成(可以访问当前this实例)
  30. async created() {
  31. let res = await getInfoApi(Number(this.$route.params.id));
  32. res.data.forEach((v) => {
  33. // console.log(v);
  34. if (v.menuId === 6001) {
  35. this.data1 = v;
  36. return;
  37. } else if (v.menuId === 6002) {
  38. this.data2 = v;
  39. return;
  40. }
  41. });
  42. },
  43. //生命周期 - 挂载完成(可以访问DOM元素)
  44. mounted() {},
  45. beforeCreate() {}, //生命周期 - 创建之前
  46. beforeMount() {}, //生命周期 - 挂载之前
  47. beforeUpdate() {}, //生命周期 - 更新之前
  48. updated() {}, //生命周期 - 更新之后
  49. beforeDestroy() {}, //生命周期 - 销毁之前
  50. destroyed() {}, //生命周期 - 销毁完成
  51. activated() {}, //如果页面有keep-alive缓存功能,这个函数会触发
  52. };
  53. </script>
  54. <style lang='less' scoped>
  55. .Son6 {
  56. width: 100%;
  57. height: 100%;
  58. /deep/.comBs{
  59. display: none;
  60. }
  61. }
  62. </style>