温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

Vue怎么更改表格中的某一行选项值

发布时间:2022-04-24 10:39:03 来源:亿速云 阅读:316 作者:iii 栏目:开发技术

本文小编为大家详细介绍“Vue怎么更改表格中的某一行选项值”,内容详细,步骤清晰,细节处理妥当,希望这篇“Vue怎么更改表格中的某一行选项值”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

如何更改表格中的某一行选项值

结合后端接口,进行相应的传参 Id, state值等,因相关组件库中的方法说明比较简单,有些需要自己去尝试,如下图中change()方法的传参等

//ajax发送请求的相关方法:
get : 获取  ,
post: 新增 ,
put/patch : 更改,
delete:  删除

代码实现

Vue怎么更改表格中的某一行选项值

组件库中的方法介绍:

Vue怎么更改表格中的某一行选项值

接口示例:

Vue怎么更改表格中的某一行选项值

效果:

Vue怎么更改表格中的某一行选项值

对table某一行的数据进行编辑,删除,查看详情操作

效果图

Vue怎么更改表格中的某一行选项值

在html中需要对button按钮进行template包裹,scope.row就是这一行的数据

<el-table-column label="操作">
<template slot-scope="scope">
<el-button type="primary" @click="editProgram(scope.row)">编辑</el-button>
<el-button type="danger"  @click="del(scope.row)">删除</el-button>
<el-button type="primary" @click="showDetail(scope.row)">详情</el-button>
</template>
</el-table-column>

读到这里,这篇“Vue怎么更改表格中的某一行选项值”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注亿速云行业资讯频道。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

vue
AI