如何滚动到Vue中的特定数据值？

Question

我在 Vue 中有一个简单的表格：

<tbody>
    <tr v-for="(item, index) in items">
        <td>
            ...
        </td>       
    </tr>
</tbody>

items 是通过unshift 动态添加的。主要的是我需要通过up、down 键在表格中导航，所以我这样做了：

jQuery(document).keydown((e) => {
    const which = e.which;

    if ([38, 40].indexOf(which) != -1) {
        e.preventDefault();

        if (this.active_index == null) {
            this.active_index = 0;
        } else {
            if (e.which == 38) {
                // up
                this.active_index--;
            } else {
                // down
                this.active_index++;
            }
        }

        console.log(this.items[this.active_index])
    }
});

是否有可能以某种方式获取this.items[this.active_index] 元素或其位置以滚动到它。

Answer 1

<tbody>
   <tr v-for="(item, index) in items" ref="'dom'+index">
       <td>
           ...
       </td>       
   </tr>

绑定ref和data，当你需要获取dom时，你可以使用this.$refs[dom${this.active_index}]