0.6.16 Release Notes

調整

• 模板渲染
  • 新增 event、attr 等多個參數傳遞支持
    • q-test 等同於 :test
    • qe-click 等同於 @click
  • index.html

    <body></body>
    <script>
        document.addEventListener("DOMContentLoaded", async () => {
            const test = await new QUI({
                // id: "test"
                data: {
                    test1: "text test 1",
                    test2: "text test 2",
                    test3: "text test 3",
                },
                event: {
                    test: e => {
                        alert("test");
                    }
                },
                render: _ => `
                    section
                    "{{ test1 }}"
                    div#main-card.primary.highlighted (q-title: "test1" 
                        q-content: "12312312"
                        qe-click: "test"
                        style: "background: red;"
                    ) ["{{ test2 }}"
                        "<br>"
                        "{{ test3 }}"
                    ]`
            }).fragment();
    
            document.getElementById("test").appendChild(test)
    
        });
    </script>
    

  • result

    <body>
        <section id="test">
            <section></section>
            text test 1
            <div id="main-card" class="primary highlighted" style="background: red;" title="text test 1" content="12312312">
            text test 2<br>text test 3
            </div>
        </section>
    </body>