How to select the vue js el using CSS attribute selector?

Question

I have this HTML:

<div data-identifier='app'>
   ...
</div>

And I have this Vue js code:

      var app = new Vue({
            el: '[data-identifier]',
            data: {
                
            },
            methods: {

            }
        });

But it seems that Vue does not understand [data-identifier] CSS selector.

How can I use attribute CSS selector with Vue js?

Boussadjra Brahim · Accepted Answer · 2021-12-05 09:07:05Z

1

It should work as shown below:

  var app = new Vue({
            el: '[data-identifier]',
            data: {
              msg:"hello" 
            },
            methods: {

            }
        });

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div data-identifier='app'>
   {{msg}}
</div>

answered Dec 5, 2021 at 9:07

Boussadjra Brahim

90k19 gold badges163 silver badges183 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to select the vue js el using CSS attribute selector?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related