JSFiddle - React, Tailwind, and code Playground

by janzikmund

HTML

<html>
<head>
<script src="https://unpkg.com/alpinejs" defer></script>
</head>
<body>
	<div x-data="{ user: { number: 5 }}">
		<template x-if="user">
			<div>
				<div x-data="{ count: 0 }" x-modelable="count" x-model="user.number">
					<button @click="count++">Increment</button>
				</div>

				Number: <span x-text="user.number"></span>
			</div>

		</template>

		<button @click="user=null">remove user</button>
	</div>
</body>