您的位置:首页技术文章
文章详情页

javascript - elementui input带提示框 选中传参问题

【字号: 日期:2023-03-31 13:11:03浏览:34作者:猪猪

问题描述

最近用了elementui做项目,遇到一些问题。

需求:选中提示内容之后 给datatable对应行row的id赋值,(后台要求传id,不传input的值)。

问题:自定义table嵌套 带提示的input,select函数api上自带一个参数,我额外添加一个参数row之后,就获取不到当前的选中的数据?

<el-table-column prop='futuresContractId' label='采购合约' width='120'> <template scope='scope'> <el-autocomplete v-model='scope.row.id' :value='scope.row.futuresContractId' :fetch-suggestions='querySearch' placeholder='请输入' :trigger-on-focus='false' @select='handleSelect(scope.row)' > </el-autocomplete> </template> </el-table-column>

querySearch(queryString, cb) {var restaurants = [ {id:2,name:'M1701',value:'M1701'}, {id:4,name:'M1705',value:'M1705'} {id:8,name:'M1709',value:'M1709'}];var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants; // 调用 callback 返回建议列表的数据cb(results); }, createFilter(queryString) { return (restaurant) => { return (restaurant.value.indexOf(queryString.toLowerCase()) >= 0); }; }, handleSelect(row) { console.log(row) //?这里可以把当前行row传过来,疑问是如何把选中的值id传给当前的row的id? //如不带参数过来,默认参数就是选中的restaurants元素 },

javascript - elementui input带提示框 选中传参问题

javascript - elementui input带提示框 选中传参问题

问题解答

回答1:

你这种思路还是老的思路,没有享受 VueJS 的大法。

Autocomplete 组件,当你选择以后,直接就会把 Value 赋值给你的 v-model='scope.row.id' 的了。所以你的疑问 疑问是如何把选中的值id传给当前的row的id? 不是疑问。

handleSelect(row) { // 默认参数就是当前的row // row 的 ID 已被改变,无需手动处理}

我根据的你的代码,弄了一个可执行的,你看下,如果理解不正确,及时指出。

https://jsfiddle.net/j6toc479/3/

标签: JavaScript
相关文章: