oleg
/
alpine
mirrorاز https://github.com/alpinejs/alpine.git


			
				
					
						
						
							12345678910111213141516171819202122232425262728293031323334353637
							<html>
    <!-- <script src="./packages/intersect/dist/cdn.js" defer></script>
    <script src="./packages/morph/dist/cdn.js" defer></script>
    <script src="./packages/persist/dist/cdn.js"></script>
    <script src="./packages/focus/dist/cdn.js"></script>
    <script src="./packages/mask/dist/cdn.js"></script>
    <script src="./packages/ui/dist/cdn.js" defer></script> -->
    <script src="./packages/anchor/dist/cdn.js" defer></script>
    <script src="./packages/alpinejs/dist/cdn.js" defer></script>
    <!-- <script src="//cdn.tailwindcss.com"></script> -->
    <!-- <script src="//cdn.tailwindcss.com"></script> -->

    <div x-data="{ foo: 'bar' }" x-model="foo">
        <select x-model="$model">
            <option>bar</option>
            <option>baz</option>
        </select>

        <h1 x-text="foo"></h1>
        <h2 x-text="$model.get()"></h2>
    </div>

    <div x-data="{ count: 1 }">
        <div>
            <span x-text="count"></span>

            <main x-data="{ value: $model }" x-model="count">
                Count: <h1 x-text="value"></h1>

                <div x-data="{ foo: 'bar' }">
                    <input type="text" x-model="foo">
                    Inner input: <span x-text="foo"></span>
                </div>
            </main>
        </div>
    </div>
</html>