data-star示例

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="module"
        src="https://cdn.jsdelivr.net/gh/starfederation/datastar@v1.0.0-beta.5/bundles/datastar.js"></script>
    <script type="module" src="https://unpkg.com/marked@15.0.7/marked.min.js"></script>
</head>

<body data-signals="{content: ''}">
    <textarea data-bind-input data-computed-html="marked.parse($input)"
        data-on-input="$content.innerHTML = $html"></textarea>
    <div data-text="$input">
        I will be replaced with the contents of the input signal
    </div>
    <div>
        <div data-text="$html"></div>
        <div data-ref-content></div>
    </div>
</body>

</html>
posted @ 2025-02-12 14:11  卓能文  阅读(37)  评论(0)    收藏  举报