vue script结构

记录一下script结构

<script>
  import { getList, doDelete } from '@/api/table'    //导入js方法
  import TableEdit from './components/TableEdit'     //导入vue文件，展示弹窗形式
  export default {
    name: 'ComprehensiveTable',  
    components: {
      TableEdit,
    },
    filters: {                           //过滤器，这里可以用来实现标签的样式，参考博文  https://i.cnblogs.com/posts/edit-done;postId=16553643
      
    },
    data() {                        //初始化数据
      return {
        imgShow: true,
        list: [],
        imageList: [],
        listLoading: true,
        layout: 'total, sizes, prev, pager, next, jumper',
        total: 0,
        background: true,
        selectRows: '',
        elementLoadingText: '正在加载...',
        queryForm: {
          pageNo: 1,
          pageSize: 20,
          title: '',
        },
      }
    },
    computed: {                 //computed擅长处理的场景：一个数据受多个数据影响   (没有很明白，先写着
      height() {
        return this.$baseTableHeight()
      },
    },
    created() {           // 实例已经创建完成之后被调用。在这一步，实例已完成以下的配置：数据观测(data observer)，属性和方法的运算， watch/event 事件回调。然而，挂载阶段还没开始，$el 属性目前不可见。
      this.fetchData()
    },
    beforeDestroy() {},   // 实例销毁之前调用。在这一步，实例仍然完全可用。
    mounted() {

　　　　　　　// 编译好的HTML挂载到页面完成后执行的事件钩子

　　　　　　　// el 被新创建的 vm.$el 替换，并挂载到实例上去之后调用该钩子。

　　　　　　　// 此钩子函数中一般会做一些ajax请求获取数据进行数据初始化　　 

　　}, 
    methods: {     // 组件的方法
      
    },
  }
</script>