elementui table组件的setCurrentRow方

在一个项目中引入了elementui，我在使用他们的table组件的时候，想实现这样的一个功能，
页面一进来就到后台请求数据，在展示出来，并且默认选择列表的第一行数据，默认选中的时候还请求另外一个接口。上代码

<div>
    <template>
        <el-table ref="singleTable"
                  :data="meteorologicallist"
                  :row-style="rowStyle"
                  :current-row-key=1
                  row-key="1"
                  highlight-current-row
                  v-on:current-change="handleCurrentChange"
                  style="width:100%;overflow-x:hidden">
            <el-table-column type="index"
                             style="width:50%"
                             width="50%"
                            color="#0c1B32"
                             >
            </el-table-column>
            <el-table-column property="stationName"
                             style="width:100%"
                             label="浮标名字"
                             width="auto">
            </el-table-column>
            <el-table-column property="tideStationNO"
                             style="width:100%"
                             label="编号"
                             width="100%">
            </el-table-column>
        </el-table>
    </template>
</div>

 watch: {
            meteorologicallist: function (newVal, oldVal) {
                var _this = this;
                if (newVal != oldVal) {
                    _this.selectfirst(newVal[0])
                   
                }
            }
        },
 methods: {
            selectfirst: function (row) {
                this.$refs.singleTable.setCurrentRow(row);
            },
            handleCurrentChange(raw) {
                this.$emit('locationmap', raw);
                _messagebus.send(this.singleelectionid, raw);
                _messagebus.send(this.bouyobj, raw);
            },
  },
 props: ['meteorologicallist']

页面进来的时候，数据请求回来，并且handleCurrentChange能通过selectfirst的方法来触发，
但是样式并没有修改，而且我点击第一行的时候也没有显示高亮，只能我点击了另外的一行再点击第一行的时候才会显示高亮，表示选中的状态。以下是我在github 在element的iisure找的，还没有找到解决方法。各位朋友不知道有没有遇到类似的问题，是怎么解决的呢？