У меня есть компонент инпут, использую его на своей странице. Мне необходимо чтобы значение его value связывалось с пропсом email на моей странице, но почему-то не работает. Значение как было пустым по умолчанию, так и остается.
Вот код инпута:
<template>
<my-input :placeholder="phEmail" v-model="email" :value="email"></my-input>
<my-btn class="loginBtn" :text="text" @click="sendData"></my-btn>
</template>
<script>
import MyBtn from '@/components/UI/MyButton.vue';
import MyInput from '@/components/UI/MyInput.vue';
export default {
components: {MyBtn,, MyInput},
data() {
return {
phEmail: 'Введите адрес эл. почты',
email: '',
}
},
methods: {
sendData() {
console.log("Email value on sendData:", this.email);
console.log(this.email);
// if (this.email.length > 0 && this.email.length <= 100) {
// this.email = '';
// } else {
// this.email = '';
// this.phEmail = 'недопустимая длина';
// }
}
}
}
</script>
вот код компонента инпут:
<template>
<input class="inputBlock" @input="updateValue" :placeholder="placeholder" :value="value">
</template>
<script>
export default {
props: {
placeholder: {
type: String,
required: false,
default: '',
},
value: {
type: String,
required: false,
default: '',
},
},
methods: {
updateValue(event) {
console.log("Emitting input event with value:", event.target.value);
this.$emit('input', event.target.value);
}
}
}
</script>
Простой
