.html:
<div id="app">
<input type="hidden" name="data" value="Hello" id="data">
</div>
script:
new Vue({
el: "#app",
data() {
return {
someData: "",
};
},
});
I want to pass value(Hello) to someData I've tried v-model but it don't work with hidden inputs
Assuming you're generating that HTML server-side and want to get the value from HTML into Vue, you can simply add a ref to the <input> and in the mounted hook, read the value
new Vue({
el: "#app",
data: () => ({
someData: ""
}),
mounted () {
// read the "value" from the input element
this.someData = this.$refs.data.value
}
})<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.min.js"></script>
<div id="app">
<!-- 👇 note the new "ref" attribute -->
<input type="hidden" ref="data" name="data" value="Hello" id="data">
<!-- just an example to show the data has been assigned -->
<pre>someData = {{ someData }}</pre>
</div>If you don't want to add ref or any other changes to the HTML, you can of course query the DOM directly
mounted () {
this.someData = document.getElementById("data").value
}
v-model