vxe-table icon indicating copy to clipboard operation
vxe-table copied to clipboard

自定义表格复选框后,会导致checkbox-change和checkbox-all事件失效

Open gdisk opened this issue 2 years ago • 3 comments

可复现的链接:

https://jsrun.net/aYzKp/edit

问题描述与截图:

自定义表格复选框后,会导致checkbox-change和checkbox-all事件失效

期望的结果:

No response

操作系统:

windows 10

浏览器版本:

101.0.4951.54

vue 版本:

3.2.33

vxe-table 版本:

4.2.3

gdisk avatar May 12 '22 06:05 gdisk

请问你解决了吗

643755984 avatar Dec 07 '23 09:12 643755984

我想用 el-checkbox 自定义表格复选框,也遇到了同样的问题。可能需要仿照源码自己触发事件 https://github.com/x-extends/vxe-table/blob/ba9bc7c1f8c1747fb6082328a3e5109c7b5c6b09/packages/table/src/table.ts#L5785。不确定渲染器能不能有所帮助。最后我放弃了自定义。

如果可以,还是希望文档这里 https://vxetable.cn/#/table/advanced/customCheckbox 可以说明一下如何不让 checkbox-change 和 checkbox-all 事件失效。

感谢各位贡献者的付出。

ModyQyW avatar Dec 26 '23 06:12 ModyQyW

请问你解决了吗

我这边使用是正常的

    function toggleAllCheckbox() {
      tableRef.value?.toggleAllCheckboxRow()
    }

    function toggleCheckbox(row) {
      tableRef.value?.toggleCheckboxRow(row)
    }

    return () => (
      <vxe-column
        type="checkbox"
        class={ns.b('checkbox')}
        width={50}
        fixed={props.column.fixed || 'left'}
        align={props.column.align || 'center'}
        resizable={false}
      >
        {{
          header: ({ checked, indeterminate }) => (
            <el-checkbox
              modelValue={checked}
              indeterminate={indeterminate}
              onChange={toggleAllCheckbox}
            ></el-checkbox>
          ),
          checkbox: ({ row, checked, indeterminate }) => (
            <el-checkbox
              modelValue={checked}
              onChange={() => toggleCheckbox(row)}
            ></el-checkbox>
          ),
        }}
      </vxe-column>
    )

xiangxiangsu avatar Feb 21 '24 03:02 xiangxiangsu