Есть некий компонент в котором я получаю данные с апи и вывожу их
Код что то в этом роде из себя представляет:
<template>
<div v-if="user">
<input v-model="user.name" />
</div>
</template>
<script>
export default {
data: () => ({
user: null
}),
methods: {
loadUser () {
this.$api.users.show(userId) {
//from response get user instance...
this.user = response
}
}
}
}
</script>
Так вот, что то задумался и захотелось создать отдельный класс с моделью пользователя, и при этом реагировать на изменения атрибутов
Пришел к такой структуре:
export default class User {
constructor (payload) {
this._original = payload
this._attributes = User.refactorPayload(payload)
this._changed = {}
}
И данные хотел отображать в компоненте как:
user.getAttribute('name')
Это все сделал, но столкнулся с проблемой two-way-binding
У меня все атрибуты содержаться в _attributes
В общем я не знаю как сделать геттер-сеттеры в js...
С геттерами получилось через обертку getAttribute:
getAttribute(key){
if (this._attributes.hasOwnProperty(key)) {
return this._attributes[key]
}
return null
}
Но если я в v-model вставлю user.getAttribute('name'), то соответственно ничего не изменится
В общем я не знаю как это правильно нужно организовать...
Помогите пожалуйста
Не хочется делать через user._attributes.name, а хочется как то более "правильнее" что ли..
