uni-app表格tr添加点击事件

uni-app 如何点击表格的行跳转到对应的页面

一、 tr 组件界面中给uni-table-tr定义一个 click 事件

<template>
    <view class="uni-table-tr" @click="getRow">
        <checkbox-group v-if="selection === 'selection'" class="checkbox" :class="{'tr-table--border':border}" @change="change">
            <label>
                <checkbox value="check" :checked="value"/>
            </label>
        </checkbox-group>
        <slot></slot>
    </view>
</template>

并用事件传值

getRow() {
	this.$emit("row-click")
}

二、使用组件的页面调用子组件事件@row-click=“rowclick(item)”

<uni-table border stripe emptyText="暂无更多数据" :loading="loading">
    <!-- 表头行 -->
    <uni-tr>
        <uni-th align="center" width="50">姓名</uni-th>
        <uni-th align="center" width="50">年龄</uni-th>
        <uni-th align="center" width="50">地址</uni-th>
    </uni-tr>
    <!-- 表格数据行 -->
    <uni-tr v-for="item in tableData" :key="item.id" @row-click="rowclick(item)">
        <uni-td align="center">{{ item.name }}</uni-td>
        <uni-td align="center">{{ item.age }}</uni-td>
        <uni-td align="center">{{ item.address }}</uni-td>
    </uni-tr>
</uni-table>


methods: {
	rowclick(item) {
		console.log('item', item);
	}
}

这样就搞定啦！！！