Stimulus: data-target and data-action sintax

Created on 23 Apr 2018  路  3Comments  路  Source: hotwired/stimulus

Hi, it would be nice if stimulus have this:

I known that we can add multiple controllers on data-controller but, why not if there's only one controller, we can do this:

After data-controller='controller' and instead of data-target='controller.target', we do only data-target='target' for a single controller? And instead data-action='click->controller#method' we do only data-action-click='method' or data-action-click='controller#method' for multiple controllers?

Thanks for this great project!

Most helpful comment

I'm afraid that it will be useless when you nest controllers. F.e:

<body data-controller="page">
    <header data-controller="header">
        <nav data-target="main" data-action-click="test"></nav>
    </header>
</body>

You can't say if target is page.main or header.main and action click is page#test or header#test.

All 3 comments

I'm afraid that it will be useless when you nest controllers. F.e:

<body data-controller="page">
    <header data-controller="header">
        <nav data-target="main" data-action-click="test"></nav>
    </header>
</body>

You can't say if target is page.main or header.main and action click is page#test or header#test.

I agree with @rupasix, we better keep de name scope to prevent conflicts. My only annotation on stimulus attribute naming is that data-target is generic enough to conflict with external libraries ( boostrap modal is one that comes to my mind). I know, maybe bootstrap should rename-it data-modal-target. But that's another discussion, i don't actually used bootstrap in a fews year, but just wanted to start the discussion.

So maybe scope it a little bit data-controller-target?
鉁岋笍

Thanks, @tiagocassio. We explored that idea early on and found it could lead to ambiguous situations like the one @rupasix shared. By including the identifier in every target and action descriptor we can ensure consistent behavior.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

merwok picture merwok  路  4Comments

saneef picture saneef  路  4Comments

ngan picture ngan  路  3Comments

jenkijo picture jenkijo  路  3Comments

thiagomajesk picture thiagomajesk  路  4Comments