Here is the code snippet for my "ecedata" component with an input field:
<template>
<div class="col-l-4">
<p style="text-align: center">Data/day (GB)</p>
<div class="form-input-set" style="background: white">
<input v-bind:value="dataday" v-on:change="$emit('changedataday', $event.target.value)" type="number" class="form-input">
</div>
</div>
</template>
<script>
export default {
name:"ecedata" ,
props: {
dataday:Number,
},
data () {
return {
}
},
}
</script>
This component is being called in the main app.vue like this:
<template>
<ecedata v-bind:dataday="dataday" v-on:changedataday="vuedataday" ></ecedata>
</template>
<script>
import ecedata from '@/components/ece/data/ecedata.vue'
export default {
name: 'app',
components: {
ecedata,
},
data () {
return {
dataday:0,
}
},
methods: {
vuedataday() {
alert(this.dataday)
}
},
};
</script>
I've noticed that it always returns a value of 0 on input. Can you help me figure out what's causing this issue?