## demoList
demoList使用样例
:::demo
```html
 <template>
  <a-card title="列表页">
    <a-button slot="extra" type="primary" icon="plus" @click="addList()">
      新增
    </a-button>

    <vxe-form :data="params" @submit="loadData(true)">
      <vxe-form-item title="信用主体名称" field="name" span="6">
        <vxe-input v-model="params.name" placeholder="请输入名称" clearable></vxe-input>
      </vxe-form-item>

      <vxe-form-item title="是否复核矫正" field="sex" span="6">
        <vxe-select v-model="params.sex" placeholder="请选择性别" clearable>
          <vxe-option value="1" label="是"></vxe-option>
          <vxe-option value="2" label="否"></vxe-option>
        </vxe-select>
      </vxe-form-item>
      <vxe-form-item>
        <a-button type="primary" icon="search" html-type="submit">
          查询
        </a-button>
      </vxe-form-item>
    </vxe-form>

    <dxx-table ref="xTable" :data="tableData">
      <vxe-table-column type="seq" title="序号" width="80"></vxe-table-column>
      <vxe-table-column field="name" title="信用主体名称" width="350" align="left" header-align="center"></vxe-table-column>
      <vxe-table-column field="role" title="评价时间"></vxe-table-column>
      <vxe-table-column field="sex" title="评价结果"></vxe-table-column>
      <vxe-table-column field="age" title="所属区域"></vxe-table-column>
      <vxe-table-column field="isjiao" title="是否复核矫正"></vxe-table-column>
      <vxe-table-column title="操作">
        <template #default="{row}">
          <a-button type="link" size="small" @click="goToPage('/demo/demoDetail/' + row.id)">
            详细
          </a-button>
          <a-config-provider :auto-insert-space-in-button="false">
            <a-button size="small" type="link" @click="delete(row.id)">
              删除
            </a-button>
          </a-config-provider>
        </template>
      </vxe-table-column>
    </dxx-table>

    <dxx-pager :current-page="params.page" :page-size="params.rows" :total="params.total" @page-change="(pageOption)=>{comPageChange(pageOption,params,loadData)}">
    </dxx-pager>

 
  </a-card>
</template>

<script>
 
export default {
  //页面引用的组件
  components: {  },
  //父页面传递参数
  props: {},

  data() {
    return {
      "tableData": [{
        "id": 10001,
        "name": "英联（哈尔滨）食品添加剂有限公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "英联（哈尔滨）食品添加剂有限公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "巴彦科强水务有限责任公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "哈尔滨丰源农牧业有限公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "英联（哈尔滨）食品添加剂有限公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "哈尔滨康达环保投资有限公司（群力污水处理厂）",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "哈尔滨合浦食品有限公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "英联（哈尔滨）食品添加剂有限公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "巴彦科强水务有限责任公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }, {
        "id": 10001,
        "name": "哈尔滨丰源农牧业有限公司",
        "role": "2020-03-26 16:58:24",
        "sex": "诚信",
        "age": "阿城区",
        isjiao: '是'
      }],

      //请求参数
      params: {
        name: '',
        nickname: '',
        sex: '1',
        rows: 10,
        page: 1,
        total: 0
      }
    }
  },
  //监控计算变量
  computed: {},
  //监听
  watch: {},
  //dom加载完执行
  mounted() { },
  //页面的构造方法
  created() {
    this.loadData();
  },
  //页面的自定义方法
  methods: {

    /**
     * @description: 加载表格数据
     * @author: +c
     * @param {*} isFirstPage 是否第一页
     * @return {*}
     */
    loadData(isFirstPage = false) {
      if (isFirstPage) { this.params.page = 1 }
      console.log(JSON.stringify(this.params));
      /* 表格带筛选条件 合并分页参数
          Object.assign(this.formData, this.params);
          this.$http({
            method: "post",
            url: this.apiHost + "/demo/demo/demo",
            data: this.formData,
          })
          .then(res => {
            if (res.data.code == "200") {
              this.tableData = res.data.data.records
              this.params.page = res.data.data.current;
              this.params.rows = res.data.data.size;
              this.params.total = res.data.data.total;
            }
          }) */
    },
    /**
     * @description: 新增
     * @author: +c
     * @return {*}
     */
    addList() {
      // this.$refs.detail.show()
    }

  }
};
</script>

<style>
</style>
```
:::