2023年7月25日发(作者：)

Avue远程搜索输⼊框，联动赋值v2.8.0及以上Avue版本: v2.8.0及以上适⽤本⽂，⽂章⽬录《 Avue 远程搜索输⼊框，联动赋值》效果图：前⾔avue在更新到 v2.8.0 版本之后，优化了卡槽逻辑性能，对slot、formslot、typeslot、headerslot、labelslot、errorslot等卡槽进⾏了调整。所以之前版本的代码已经不适⽤。需要对代码进⾏数据调整。⼀、基于element-ui实现（效果好）Option属性export const tableOption = { "border": true, "index": true, "indexLabel": "序号", "stripe": true, "menuAlign": "center", "align": "center", "searchMenuSpan": 6, "searchslot": true, "selection":true, "column": [ { "type": "select", "label":"编码", "prop": "Number", "search": true, //设置搜索项 "span": 12, }, { "type": "input", "label": "描述1", "prop": "desc1", "span": 12, }, { "type": "input", "label": "描述2", "prop": "desc2", "span": 12, }, { "type": "input", "label": "版本", "prop": "craftVerion", "span": 12 } ],}中在 avue-crud 组件中添加⾃定义插槽 中的 methods对象中的⽅法

路由中添加的⽅法（接⼝后端已写好，前端只是调⽤，本⽂不讨论后端实现）export function queryNum(num) { return request({ url: '/admin/version/vp/', //后台监听的路径，模糊匹配返回 method: 'get', //get请求 params: { "num":num //监听的属性值 } })}element-ui ⽅法效果如下：在联动描述1、描述2 输⼊框时，⼏乎同步联动。总结1、element-ui⽅法效果最好，只发送⼀次请求，响应快；2、element-ui⽅法简单，适合实际开发使⽤，适合开发者了解其运⾏原理，提升开发思维。3、如果你有疑问或者有更好的实现⽅法请留⾔，交流学习