从 jQuery 数据表调用 React 函数

发布于 2025-01-09 15:05:15 字数 789 浏览 0 评论 0原文

我在 React 应用程序中使用 jQuery 数据表。我想从数据表中调用反应函数。在数据表中,我使用渲染函数创建带有编辑和删除按钮的自定义列。因此,当单击按钮时,我想显示引导模式。下面是渲染的代码

{
                    "targets": 4,
                    "data": "",
                    "render": function (data, type, row, meta) {
                        return `
                        <div><button type="" class=" mr-3"><img src="images/table-edit-icon.svg" alt=""></button></div>
                        <div><button type="" class="" onClick={e => { setDeleteShow(true); }}><img src="images/table-delete-icon.svg" alt=""></button></div>
                        `;
                    }
                }

这里setDeleteShow是react中用于显示模态的函数。它不起作用。它在 UI 上显示函数名称。我怎样才能调用这个函数?

I am using the jQuery data table in a react application. I want to call a react function from the data table. In the data table, I am using the render function to create a custom column with edit and delete buttons. So when clicking on the button I want to show a bootstrap modal. Below is the code for the render

{
                    "targets": 4,
                    "data": "",
                    "render": function (data, type, row, meta) {
                        return `
                        <div><button type="" class=" mr-3"><img src="images/table-edit-icon.svg" alt=""></button></div>
                        <div><button type="" class="" onClick={e => { setDeleteShow(true); }}><img src="images/table-delete-icon.svg" alt=""></button></div>
                        `;
                    }
                }

Here setDeleteShow is a function in react for showing the modal. It is not working. It is displaying the function name on UI. How can I call this function?

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

与之呼应 2025-01-16 15:05:15

我可以使用下面的代码调用反应函数。

createdCell: (td, cellData, rowData, row, col) => {
                        ReactDOM.render(
                            <div class=" d-flex">
                            <div><button type="" class=" mr-3"><img src="images/table-edit-icon.svg" alt=""/></button></div>
                        <div><button type="" class="" onClick={() => setDeleteShow(true)}><img src="images/table-delete-icon.svg" alt=""/></button></div>
                        </div>, td)
                    }

I was able to call the react function using below code.

createdCell: (td, cellData, rowData, row, col) => {
                        ReactDOM.render(
                            <div class=" d-flex">
                            <div><button type="" class=" mr-3"><img src="images/table-edit-icon.svg" alt=""/></button></div>
                        <div><button type="" class="" onClick={() => setDeleteShow(true)}><img src="images/table-delete-icon.svg" alt=""/></button></div>
                        </div>, td)
                    }
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文