opdavies/stimulus-esbuild-example
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

Add count controller

Browse source
This commit is contained in:
Oliver Davies 2024-03-29 00:50:46 +00:00
parent d379fdb73d
commit 7146a7f66d
2 changed files with 42 additions and 2 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

35
assets/js/controllers/count_controller.js Normal file
View file

@ -0,0 +1,35 @@
import { Controller } from "@hotwired/stimulus";
export default class extends Controller {
static targets = ["result"];
static values = {
count: Number,
};
connect() {
console.log("count#connect");
this.resultTarget.textContent = this.countValue;
}
countValueChanged() {
console.log("count#countValueChanged");
this.resultTarget.textContent = this.countValue;
}
decrement() {
console.log("count#decrement");
if (this.countValue > 0) {
this.countValue = this.countValue - 1;
}
}
increment() {
console.log("count#increment");
this.countValue = this.countValue + 1;
}
}

9
public/index.html
View file

@ -4,8 +4,13 @@
<title>Stimulus esbuild example</title>
</head>
<body>
<div data-controller="hello">
<h1>Hello, World!</h1>
<div data-controller="count">
<p>Count: <span data-count-target="result"></span></p>
<div>
<button type="button" data-action="count#increment">+</button>
<button type="button" data-action="count#decrement">-</button>
</div>
</div>
<script src="/build/app.js"></script>