1026 请求接口时展示loading效果_a-table 接口数据请求时显示loading

// 接口请求数据
    getData() {
      return new Promise((resovle, reject) => {
        console.log('reject', reject);
        this.loading = true;
        this.tableLoading = true;
        testCnode().then(res => {
          // console.log('res1',res)
          if (res.data.success) {
            resovle(res);
          }
        });
      });
    },

    onSearch() {
      this.getData().then(res => {
        if (res.data.success) {
          let tableData = res.data.data;
          tableData.forEach((ele, index) => {
            ele.key = tableData[index].id;
          });
          this.data = tableData;
          this.loading = false;
          this.tableLoading = false;
          message.success('请求成功');
        }
      });
    },
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

		<a-button type='primary' icon='search' on-click={this.onSearch} loading={this.loading}>
          搜索
        </a-button>
        <div style='height:500px'>
          <a-table
            bordered
            scroll={{ y: 400 }}
            columns={this.columns}
            loading={this.tableLoading}
            data-source={this.data}
            row-selection={{ selectedRowKeys: this.selectedRowKeys, onChange: this.onChange }}
            scopedSlots={this.scopedSlots()}
          ></a-table>
        </div>
1
2
3
4
5
6
7
8
9
10
11
12
13
14