Get components from custom attributes with vue? - vue.js

Question

Im usign vue js for validate form before submit.
This code start a new Vue getting data from the ID = app:
const app = new Vue({
el:"#app",
data:{
text: null
}
I want create a custom attribute named form-number and get data usign my
attribute and not the div.
Example:
Change this
<form id="app" method="post">
<input type="text" v-model='text'>
</form>
For this
<form form-number="1" method="post">
<input type="text" v-model='text'>
</form>
const app = new Vue({
el:"form-number='1'",
data:{
text: null
}

Answer 1

In Vue the template is not to be read - inputs are possible through bindings (like v-model).
See this snippet:
const app = new Vue({
data: {
formNumber: 1,
text: ''
}
})
app.$mount('[myCustomAttribute="mounthere"]')
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div myCustomAttribute="mounthere">
<form :form-number="formNumber" method="post">
<label for="text1">
From{{ formNumber }} input:
<input id="text1" type="text" v-model="text" />
</label>
</form>
{{ text }}
</div>
formNumber is also defined in the data attribute and bound to the form-number attribute, which also appears in the HTML.
EDIT
el: "#app" is just a convention for the basic Vue app. You can choose where to mount the app by any valid selector - like [myCustomAttribute="mounthere"] also works.