console 命令行工具 X clear

console

var Main = {
   data() {
    return {
      tableData:[
        {
            num:"1",
            contractName:"001",
        }],
      tableColumns: [
        {
          label: "序号",
          prop: "num",
          show: true,
        },
        {
          label: "项目编码",
          prop: "contractName",
          show: true,
        },
        {
          label: "项目名称",
          prop: "amount",
          show: true,
        },
        {
          label: "项目特征描述",
          prop: "status",
          show: true,
        },
        {
          label: "备注",
          prop: "status",
          show: true,
        },
      ],
    };
  },
  watch: {},
  computed: {},
  mounted() {},
  created() {
  },
  methods: {},
}

var Ctor = Vue.extend(Main);
var app = new Ctor().$mount('#app');

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
    <meta name="robots" content="noindex, nofollow"/>
    <meta name="googlebot" content="noindex, nofollow"/>
    <title>ccccccc - JSRUN 驱动</title>

    <script type="text/javascript" src="" ></script>
    <link rel="stylesheet" type="text/css" href="main.css"/>
    <link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
<div id="app">
  <el-table
    class="table"
    :data="tableData"
    :default-sort="{ prop: 'date', order: 'descending' }"
  >
    <template v-for="(item, index) in tableColumns">
      <el-table-column
        :key="index"
        :prop="item.prop"
        :label="item.label"
        v-if="item.show"
        :width="item.width"
        :sortable="item.sortable"
      ></el-table-column>
    </template>
  </el-table>
</div>
<script src="https://unpkg.com/vue@2.6.11/dist/vue.js"></script>
<script type="application/javascript" src="main.js"></script>
<script src="https://unpkg.com/element-ui@2.13.0/lib/index.js"></script>
</body>
</html>

.table{
  padding:10px;
  width: 80%;
}