more stimulus tests
This commit is contained in:
@@ -1,7 +1,16 @@
|
|||||||
import { Controller } from "@hotwired/stimulus"
|
import { Controller } from "@hotwired/stimulus"
|
||||||
|
|
||||||
export default class extends Controller {
|
export default class extends Controller {
|
||||||
|
static targets = [ "name", "output" ]
|
||||||
|
|
||||||
connect() {
|
connect() {
|
||||||
this.element.textContent = "Hello World!"
|
// this.element.textContent = "Hello World!"
|
||||||
|
console.log('Hello World hello_controller.js');
|
||||||
|
}
|
||||||
|
|
||||||
|
greet() {
|
||||||
|
console.log('greet');
|
||||||
|
this.outputTarget.textContent =
|
||||||
|
`Hello, ${this.nameTarget.value}!`
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,3 +1,17 @@
|
|||||||
<h1>Welcome</h1>
|
<h1>Welcome</h1>
|
||||||
|
|
||||||
<%= link_to "Articles", articles_path %>
|
<%= link_to "Articles", articles_path %>
|
||||||
|
|
||||||
|
|
||||||
|
<h2>Stimulus Check</h2>
|
||||||
|
|
||||||
|
<div data-controller="hello">
|
||||||
|
<input data-hello-target="name" type="text">
|
||||||
|
|
||||||
|
<button data-action="click->hello#greet">
|
||||||
|
Greet
|
||||||
|
</button>
|
||||||
|
|
||||||
|
<span data-hello-target="output">
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user