SOURCE

console 命令行工具 X clear

                    
>
console
var Main = {
    data() {
      return {
        viewType:1,
        columns:[{prop:'a1',label:'测试',width:'80'}],
        tableData3: [{
          date: '2016-05-03',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-02',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-04',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-01',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-08',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-06',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }, {
          date: '2016-05-07',
          name: '王小虎',
          province: '上海',
          city: '普陀区',
          address: '上海市普陀区金沙江路 1518 弄',
          zip: 200333
        }]
      }
    },
  	methods:{
      changeColumn(){
        this.viewType = !this.viewType
      },
      showDetail(row){
        alert(row.name)
      }
    }
  }
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
<div id="app">
<template>
  <el-button type="primary"  @click.native="changeColumn" size="small">切换</el-button>
  <el-table :data="tableData3" border style="width: 100%">
    <template v-if='viewType==0'>
      <el-table-column type='index' label='#' :width='60'></el-table-column>
      <el-table-column prop='name' label='姓名' :width='60'>
        <template slot-scope="scope">
					        <el-button @click="showDetail(scope.row)" type="text" >{{scope.row.name}}</el-button>
					    </template>
      </el-table-column>
      <el-table-column prop='city' label='city' :width='60'></el-table-column>
    </template>
    <template v-else>
       <el-table-column type='index' label='#' :width='60'></el-table-column>
      <el-table-column prop='name' label='姓名' :width='60'></el-table-column>
      <el-table-column prop='province' label='province' :width='60'></el-table-column>
    </template>
    </template>
  </el-table>
</template>
</div>
@import url("//unpkg.com/element-ui/lib/theme-default/index.css");

本项目引用的自定义外部资源