组件的循环引用

1、递归组件：组件在自己的模板中调用自身。
2、循环引用：当父引用子，子引用父时。

直接给大家上代码：

• MulAnalysisResult.vue

 1 <template>
 2   <div v-loading="loading">
 3     <div v-for="(item, index) in dataList" :key="index">
 4       <h6>{{ item.fileName }}</h6>
 5       <AnalysisResultTable :tableHeader="item.columns" :tableData="item.results" :height="'400px'"  ref="analysisResultTableRef" />
 6     </div>
 7   </div>
 8 </template>
 9 
10 <script>
11 /* eslint-disable */
12 import { getTestResults } from "@/api/test";
13 import AnalysisResultTable from "../components/AnalysisResultTable.vue";
14 
15 export default {
16   name: "MulAnalysisResult",
17   components: {
18     AnalysisResultTable,
19   },
20   data() {
21     return {
22       loading: false,
23       dataList: []
24     };
25   },
26   created() {
27     this.getList();
28   },
29   methods: {
30     getList() {
31       this.loading = true;
32       getTestResults(this.$route.query.id)
33         .then((res) => {
34           const { code, data, msg } = res;
35           if (code == 0) {
36             this.dataList = data || [];
37           } else {
38             this.$message.error(msg);
39           }
40         })
41         .finally(() => {
42           this.loading = false;
43         });
44     },
45   },
46 };
47 </script>
48 
49 <style scoped lang="less"></style>

说明：没有编写css样式，请自行编写