当DxLookup写在DxColumn里面时,属于DxLookup的函数不生效?
首先,提出需求:
左边选择框为DxLookup,右边一列数据需要根据左边下拉框的选择结果做出反应。所以要监听到左边下拉框所选择到的数据。
解决需求:
第一步:查询官方文档,官方有介绍到,有专门的方法可以获取到DxLookup所选择的结果。
官方推荐方法如下:
官方实例链接如下: https://js.devexpress.com/Demos/WidgetsGallery/Demo/Lookup/EventHandling/Vue/Light/
这里不作示例,遇到此问题的可以自行参考运行。
根据官网的实例, @value-changed="setSelectedValue"运行失败,方法并没有生效。
原因是:我的DxLookup是在DxColumn的,DxLookup的方法会被DxColumn拦截或者是隐藏掉,总之就是不生效。
解决问题
既然是DxColumn吧方法给拦截隐藏了,那么肯定要在DxColumn上进行处理。
经过查阅,解决方法为:
在DxColumn上,写上::set-cell-value=“setSelectedValue”
<DxColumn data-field="bomName" caption="物品名称" :set-cell-value="setSelectedValue">
<DxLookup :data-source="selectBomName" display-expr="name" value-expr="name" />
</DxColumn>
在:"setSelectedValue"方法中:
setSelectedValue(rowData,value) {
this.selectedValue = value;
rowData.bomName=null;
console.log(rowData)
this.defaultSetCellValue(rowData,value)
},
因为我要的不仅仅是拿到这个数据,也要把这个数据真正放到DxColumn中,所以有两个要点:
1.setSelectedValue方法要放在Data中,就和声明变量一样。
2.this.defaultSetCellValue(rowData,value),这个方法会把DxLookup选择的数据真正放到DxColumn上。尽管这里报了警告,但可以忽略
结束 ,以上