后端设置扩展方法
public static void SetNumCheckBox<T>(this DataGridColumnBuilder<T> builder) { _ = builder.CellTemplate(new JS("CheckBoxCellTemplate")) .EditCellTemplate(new JS("CheckBoxEditorTemplate")) .Lookup(lookup => lookup.DataSource(new object[] { new { label = "是", value = 1, }, new { label = "否", value = 0, }, }).DisplayExpr("label").ValueExpr("value")); }
前端添加单元格和编辑代码
const getNewDomId = (function () { let id = 1; return function () { return id++; }; })(); function CheckBoxEditorTemplate(el, e) { var domId = 'grid_cell_' + getNewDomId(); el.html(`<div id="${domId}"></div>`); new Vue({ el: '#' + domId, template: `<el-checkbox v-model="state" v-on:change="onChange" />`, data: { state: e.value === 1, }, methods: { onChange(value) { e.setValue(value ? 1 : 0); }, }, }); } function CheckBoxCellTemplate(container, options) { container.html( `<div class="dx-checkbox-container ${ options.value === 1 ? 'dx-checkbox-checked' : '' }"><span class="dx-checkbox-icon"></span></div>` ); }
以上就是asp.net core使用DevExtreme20将int列转为checkbox方法示例的详细内容,更多关于asp.net core将int列转为checkbox的资料请关注本站其它相关文章!
本站资源均来自互联网,仅供研究学习,禁止违法使用和商用,产生法律纠纷本站概不负责!如果侵犯了您的权益请与我们联系!
转载请注明出处: 免费源码网-免费的源码资源网站 » asp.net core使用DevExtreme20将int列转为checkbox方法示例
发表评论 取消回复