vue元素-ui获取表行的索引
vue元素-ui获取表行的索引
提问于 2019-08-20 15:16:15
我只想在表列的第一行添加一个按钮(在示例代码中标记为'Option‘)。有没有什么简单的方法可以检查v-if v-if="scope.row.index === 0"的行索引？scope.row.index在这里不起作用。
<el-table :data="mydata">
<!-- more columns -->
<el-table-column prop="option" label="Option">
<template slot-scope="scope">
<div v-if="scope.row.index === 0">
<el-row>
<el-col>
<el-input v-model="scope.row.option"/>
</el-col>
<el-col>
<el-button @click="">Check</el-button>
</el-col>
</el-row></div>
<div v-else>
<el-input v-model="scope.row.option" />
</div>
</template>
</el-table-column>
<!-- more columns -->
</el-table>回答 2
Stack Overflow用户
回答已采纳
发布于 2019-08-20 15:55:51
我通过使用$index变量找到了解决方案，该变量是当前行的索引。
<div v-if="scope.$index === 0">Stack Overflow用户
发布于 2019-12-25 20:56:47
vue template和scope.$index
我的解决方案是：
<el-table
:data="tableData"
border
class="app-downlaod-guide-table"
style="width: 100%">
<el-table-column
v-for="({
prop,
label,
align,
width,
slot,
}, i) in channelClomuns"
:key="prop + i"
:prop="prop"
:width="width"
:align="align"
:label="label">
<template
slot-scope="scope"
v-if="prop === `putLink`">
<a
target="_blank"
href="tableData[scope.$index].putLink">
{{tableData[scope.$index].putLink}}
</a>
</template>
</el-table-column>
</el-table>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/57568453
复制相关文章
相似问题
腾讯云开发者
