element-ui表格使用

 

使用element-table很简单,设置key,data等参数即可data为数组遍历结果为scope.row对象

<template>

<el-table 

        :data="tableData"

        >        

        <el-table-column

        label="标题">

        <template slot-scope="scope">

            <span>{{ scope.row.title}}</span>

        </template>

        </el-table-column>

 

        <el-table-column

        label="ID">

        <template slot-scope="scope">

            <span>{{ scope.row.id}}</span>

        </template>

        </el-table-column>

     

        <el-table-column>

            <template slot-scope="scope">

                <el-button @click="TellMeId(scope.row.id)">TellMe</el-button> 

            </template>

        </el-table-column>

</el-table>

...

</template>

...

<script>

export default{

    data(){

        return{

           tableData:[] 

        }

    },

    methods:{

        TellMeId(num){

            console.log(num)

        }

    }

}

...