Does vue.js have a shorthand for document.getElementById('#id')
like JQuery's $('#id')
?
If so, where is the reference for this in the docs so I can locate other information?
To use document. getElementById in Vue. js, we can assign a ref to the element we want to get. And then we can use this.
$v is an object that calls vuelidate (at the time of writing the comment, supported in version Vue. js 2.0), which is intended to check every input, which is made in a non-html form.
In the shorthand, everything before the argument (i.e. v-bind: ) is condensed into a single character, : . Here the argument is the event name to listen to: click . v-on has a corresponding shorthand, namely the @ character.
Vue can store references to DOM elements in a property called $ref . The first thing we have to do, is add a ref attribute to the element we want to reference in our Javascript. The value of the ref attribute will be the name of it within the $ref property.
Theres no shorthand way in vue 2.
Jeff's method seems already deprecated in vue 2.
Heres another way u can achieve your goal.
var app = new Vue({ el:'#app', methods: { showMyDiv() { console.log(this.$refs.myDiv); } } });
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script> <div id='app'> <div id="myDiv" ref="myDiv"></div> <button v-on:click="showMyDiv" >Show My Div</button> </div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With