can tou help me to fix error ObjectHtmlDivElemnt, please help me t

can tou help me to fix error ObjectHtmlDivElemnt, please help me t

jolupopajolupopa Posts: 3Questions: 1Answers: 0

Link to test case:
developer mode my laptot yet
Debugger code (debug.datatables.net):
import AuthenticatedLayout from "@/Layouts/AuthenticatedLayout";

import Breadcrumb from "@/Components/Breadcrumb";
import { Link } from "@inertiajs/react";
import DataTable from "datatables.net-react";
import DT from "datatables.net-dt";
import "datatables.net-select-dt";
import "datatables.net-responsive-dt";
import PrimaryButton from "@/Components/PrimaryButton";

DataTable.use(DT);

const Index = () => {
const breadcrumbItems = [
{ label: "Inicio", href: "/dashboard" },
{ label: "Propiedades", href: "/properties" },
];

const columns = [
    { data: "id" },
    { data: "title" },
    { data: "codigo" },
    { data: "resumen" },
    { data: "precio" },
    { data: "published_at" },
    { data: "id", name: "edit", orderable: false },
];

return (
    <AuthenticatedLayout>
        <div className="flex justify-between items-center bg-indigo-100 px-5 py-3">
            <h2 className="text-2xl font-semibold">Listar Publicaciones</h2>
            <Link href={route("property.create")}>Nueva Publicación</Link>
        </div>

        <div>
            <DataTable
                ajax={route("apiproperty.index")}
                columns={columns}
                className="display"
                scrollX={true}
                options={{
                    responsive: true,
                    select: true,
                }}
                slots={{
                    6: (data) => (

                        <Link
                            className="bg-gray-900 text-white px-3 py-2 mx-5"
                            href={route("property.edit", data )}
                        >
                            Edit
                        </Link>
                    ),
                }}
            >
                <thead>
                    <tr>
                        <th>ID</th>
                        <th>Título</th>
                        <th>Código</th>
                        <th>Resumen</th>
                        <th>Precio</th>
                        <th>Publicada</th>
                        <th>Opciones</th>
                    </tr>
                </thead>
            </DataTable>
        </div>
    </AuthenticatedLayout>
);

}

export default Index;
Error messages shown:
ObjectHtmlDivElemn
Description of problem: No show component react on movil screen

Answers

  • allanallan Posts: 63,676Questions: 1Answers: 10,497 Site admin

    Yup, very happy to help. Please link to a test case showing the issue (per the forum rules), ideally on StackBltiz or similar so I can see the source code as well as the result.

    Allan

Sign In or Register to comment.