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

Add a counter than cannot be negative

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

7
assets/js/controllers/count_controller.js
View file

@ -4,6 +4,7 @@ export default class extends Controller {
static targets = ["result"]; static targets = ["result"];
static values = { static values = {
canBeNegative: Boolean,
count: Number, count: Number,
}; };
@ -22,9 +23,11 @@ export default class extends Controller {
decrement() { decrement() {
console.log("count#decrement"); console.log("count#decrement");
if (this.countValue > 0) { if (this.canBeNegativeValue === false && this.countValue === 0) {
this.countValue = this.countValue - 1; return;
} }
this.countValue = this.countValue - 1;
} }
increment() { increment() {

11
public/index.html
View file

@ -4,7 +4,16 @@
<title>Stimulus esbuild example</title> <title>Stimulus esbuild example</title>
</head> </head>
<body> <body>
<div data-controller="count"> <div data-controller="count" data-count-can-be-negative-value="true">
<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>
<div data-controller="count" data-count-can-be-negative-value="false">
<p>Count: <span data-count-target="result"></span></p> <p>Count: <span data-count-target="result"></span></p>
<div> <div>