super.sayHi(...Array.from(arguments))
to invoke the method on the parent super class.beforeReflex
and afterReflex
to create UI spinners for anything that might take more than a heartbeat to complete. In addition to providing helpful visual feedback, research has demonstrated that acknowledging a slight delay will result in the user perceiving the delay as being shorter than they would if you did not acknowledge the delay. This is likely because we've been trained by good UI design to understand that this convention means we're waiting on the system. A sluggish UI otherwise forces people to wonder if they have done something wrong, and you don't want that.autofocus
attribute is only processed on the initial page load. If you want to implement a "click to edit" UI, you need to use a life-cycle callback method to make sure that the focus lands in the right place.afterReflex
callback to inspect the element to see if it has the autofocus
attribute and, if so, correctly set the focus on that element.autofocus
on an element that is a child of our controller. We used this.element where this is a reference to the Stimulus controller.touch: true
option on your belongs_to
associations.render
keyword to ApplicationController
.morph
with a more terse syntax:data-reflex-root
attribute containing a CSS selector that points to same DOM element where your template begins:body
tag and not know what to do.I18n.locale
using a helper that you can define in your ApplicationReflex
.with_locale
helper:.yml
files automatically reload when the browser refreshes, we've got you covered:before_reflex
callback in your ApplicationReflex
.Current.user
accessor is now available in your Reflex action methods.connect
method of your Connection
module. You can see this approach in the tenant
branch of the stimulus_reflex_harness app.id
of the current User
on messages logged from your Connection
module.#
character to the beginning of the generated id. Where the original function was intended for use in ActionView ERB templates, that #
makes it perfect for use on the server, where the #
character is required to refer to a DOM element id attribute.render
method of the ApplicationController
class.ActionDispatch::Flash::FlashHash
for the current request via the flash
accessor inside of a Reflex action.webpack-dev-server
to reload after Reflex changesbin/webpack-dev-server
while you are building your application, you can add folders in your app to the list of places that are being monitored.