element 单元格formatter对应的方法 执行两次 ,bug?

如下代码,formatter方法执行了两次。。

<!DOCTYPE html>
<html>
<head>
    <title>Vue Demo</title>
    <script src="https://cdn.bootcss.com/vue/2.6.10/vue.min.js"></script>
    <script src="https://cdn.bootcss.com/element-ui/2.12.0/index.js"></script>
    <link crossorigin="anonymous" integrity="sha384-lORadheqlc4cbo9L5It1a5q/AS57s9lXvER3RpFU97WXyO3bZL+siYtgOjLigS3D"
        href="https://lib.baomitu.com/element-ui/2.12.0/theme-chalk/index.css" rel="stylesheet">
</head>
<body>
    <div id="app">
        <template>
            <el-table :data="tableData" style="width: 100%" :default-sort="{prop: 'date', order: 'descending'}">
                <el-table-column prop="date" label="日期" sortable width="180">
                </el-table-column>
                <el-table-column prop="name" label="姓名" sortable width="180">
                </el-table-column>
                <el-table-column prop="address" label="地址" :formatter="formatter">
                </el-table-column>
            </el-table>
        </template>
    </div>
</body>
<script type="text/javascript">
    var Main = {
        data() {
            return {
                tableData: [{
                    date: '2016-05-02',
                    name: '王小虎',
                    address: '上海市普陀区金沙江路 1518 弄'
                }]
            }
        },
        methods: {
            formatter(row, column) {
                console.log('打印了两次,bug?')
                return row.address;
            }
        }
    }
    var Ctor = Vue.extend(Main)
    new Ctor().$mount('#app')
</script>
</html>
阅读 6.6k
2 个回答

本身是只跑一次,但排序后还会在跑一次
你这里的两次是:默认的一次,你设置了默认排序后,在排序后又执行了一次

default-sort的原因

推荐问题