1<!--
2* @Author: xzh
3* @Date: 2021-05-21 00:31:25
4* @LastEditTime: 2021-05-21 10:09:32
5* @LastEditors: xzh
6* @Description: 组件描述
7* @FilePath: /文件路径.vue
8* 代码版权方：'政府采购信息网'
9-->
10<template>
11 <div class="">
12
13 </div>
14</template>
15
16<script>
17// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
18// 例如：import 《组件名称》 from '《组件路径》';
19export default {
20 components: {},
21 props: [],
22 data () {
23 return {
24
25 }
26 },
27// 监听属性 类似于data概念
28 computed: {},
29// 监控data中的数据变化
30 watch: {},
31// 方法集合
32 methods: {},
33/*------生命周期-------*/
34//创建完成（可以访问当前this实例）
35 created() {},
36//挂载完成（可以访问DOM元素）
37 mounted() {},
38//创建之前
39 beforeCreate() {},
40//挂载之前
41 beforeMount() {},
42//更新之前
43 updated() {},
44//销毁之前
45 beforeDestroy() {},
46//销毁完成
47 destroyed() {},
48//如果页面有keep-alive缓存功能，这个函数会触发
49 activated() {},
50};
51</script>
52
53<style lang="stylus" scoped>
54// @import url(); 引入公共css类
55</style>
1<!--
2* @Author: xzh
3* @Date: 2021-05-21 00:31:25
4* @LastEditTime: 2021-05-21 10:09:32
5* @LastEditors: xzh
6* @Description: 组件描述
7* @FilePath: /文件路径.vue
8* 代码版权方：'丫丫'
9-->
10<template>
11<dev>{{data.param}}</dev>
12</template>
13
14// 路由守卫 这里可以路由跳转时的参数
15<script >
16import { defineComponent } from 'vue'
17export default defineComponent({
18 beforeRouteEnter(to, from, next) {
19 console.debug('路由守卫:beforeRouteEnter');
20 next();
21 },
22 beforeRouteLeave(to, from, next) {
23 console.debug('路由守卫:beforeRouteLeave',from.params);
24 to.params.isReload = from.params.isReload;
25 next();
26 }
27});
28</script>
29
30<script setup>
31// 这里可以导入其他文件（比如：组件，工具js，第三方插件js，json文件，图片文件等等）
32// 例如：import 《组件名称》 from '《组件路径》';
33// 引入数据处理
34import { reactive, ref, watch, defineProps, computed } from 'vue'
35// 引入生命周期函数
36import { onBeforeMount, onMounted, onBeforeUpdate, onUpdated,
37onBeforeUnmount, onUnmounted, onActivated, onDeactivated,
38onErrorCaptured, onRenderTriggered, onRenderTracked} from 'vue'
39// props 接收父组件传来的值
40const props = defineProps({});
41// 声明回调事件
42const emit = defineEmits(['blockAct']);
43var v = ref('');
44//
45var data = reactive({
46 param:'xzh',
47});
48// 监控data中的数据变化, 不使用监听不实例话监听方法
49// watch(() => {});
50/*------生命周期-------*/
51//创建之前 //beforeCreate
52//创建完成 //create
53//挂载之前
54onBeforeMount(() => {});
55//挂载完成（可以访问DOM元素）
56onMounted(() => {});
57//更新之前
58onBeforeUpdate(() => {});
59//更新完成
60onUpdated(() => {});
61//销毁之前
62onBeforeUnmount(() => {});
63//销毁完成
64onUnmounted(() => {});
65//如果页面有keep-alive缓存功能，这个函数会触发
66onActivated(() => {});
67onDeactivated(() => {});
68onErrorCaptured(() => {});
69onRenderTriggered(() => {});
70onRenderTracked(() => {});
71</script>
72<style lang="scss" scoped>
73// @import url(); 引入公共css类
74</style>