<template>
  <!-- 最外层只能有一个div -->
  <div class="main">
    <!-- 组件使用 -->
    <Images/>
  </div>
</template>

<script>
// 引入组件
import Images from "../../components/imagesMarketing.vue";
export default {
  name: 'HelloWorld',
  // 注册组件
  components: {
    Images
  },
  // 实例数据
  data() {
    return {

    };
  },
  // **创建前**:刚刚new Vue()之后，这个时候，数据还没有挂载呢，只是一个空壳
  beforeCreate() {

  },
  // **创建后**:这个时候已经可以使用到数据，也可以更改数据,在这里更改数据不会触发updated函数
  // 在这里请求接口
  created() {

  },
  // **载入前**:虚拟dom已经创建完成，马上就要渲染,在这里也可以更改数据，不会触发updated'
  // 在这里可以在渲染前倒数第二次更改数据的机会，不会触发其他的钩子函数，一般可以在这里做初始数据的获取
  // 接下来开始找实例或者组件对应的模板，编译模板为虚拟dom放入到render函数中准备渲染
  beforeMount() {

  },
  // **载入后**:此时，组件已经出现在页面中，数据、真实dom都已经处理好了,事件都已经挂载好了
  // 可以在这里操作真实dom等事情...
  mounted() {

  },
  // **更新前**:重新渲染之前触发
  // 然后vue的虚拟dom机制会重新构建虚拟dom与上一次的虚拟dom树利用diff算法进行对比之后重新渲染
  beforeUpdate() {

  },
  // **更新后**:数据已经更改完成，dom也重新render完成
  updated() {

  },
  // **销毁前**:销毁前执行（$destroy方法被调用的时候就会执行）,一般在这里善后:清除计时器、清除非指令绑定的事件等等...
  beforeDestroy() {

  },
  // **销毁后**:组件的数据绑定、监听...都去掉了,只剩下dom空壳，这里也可以善后
  destroyed() {

  },
  // 监听函数
  watch: {

  },
  // 事件处理
  methods: {

  },
  // 过滤器
  filters: {

  }
};
</script>

<style  scoped>

</style>