Skip to content

Components

Jump to bottom
ReactMVC edited this page Jul 1, 2023 · 4 revisions

Component in HTML

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Elroid Example</title>
    <script src="Elroid.js"></script>
</head>

<body>
    <div id="app"></div>

    <script>
        const component = new ElComponent({
            template: `
          <h2>{{title}}</h2>
          <p>Users, {{name.1}} and {{name.2}}!</p>
          <p>Admin is, Name: {{name.3.name}} and Email {{name.3.email}}!</p>
          <button el-click="Edit">Edit Tilte</button>
      `,
            el: "#app",
            data: {
                name: {
                    1: "Hossein",
                    2: "Ali",
                    3: {
                        name: "Reza",
                        email: "h3dev.pira@gmail.com"
                    }
                },
                title: 'Custom Component',
                methods: {
                    Edit() {
                        component.update({ title: "Home" });
                    }
                }
            },
        });

    </script>
</body>

</html>
Clone this wiki locally