client/Vue
vuetify error solution
void
2020. 1. 31. 10:00
1.
<v-text-field :disabled="true"></v-text-field>
출처: https://vuetifyjs.com/ko/components/textarea
2. v-for 안에 v-model 쓸 때
v-model에 item 자체를 적으면 "You are binding v-model directly to a v-for iteration alias." error 발생.
<v-col v-for="(item, index) in items ":key="index">
<v-text-field v-model="items[index]"></v-text-field>
</v-col>
출처 : https://forum.vuejs.org/t/v-for-v-model/29101
3. Cannot convert undefined or null to object
해결
Object.assign(this.values[this.editedIndex-1], this.editedItem);
// => this.values[tihs.editedIndex]하면 index가 없는 index라서 에러났던 것
4. vuex에서 온 state를 동기적으로 바꿔야하는 경우가 생겼는데, 아래 메서드를 사용하여 vuex와 vue의 연결성을 끊어서 에러를 해결하는 방법으로 해결
[vuex] do not mutate vuex store state outside mutation handlers
cleanSourse(source) {
return JSON.parse(JSON.stringify(source));
}
출처 : https://forum.vuejs.org/t/do-not-mutate-vuex-store-state-outside-mutation-handlers/29631/2
5. Computed property "" was assigned to but it has no setter.
snackbarStatus() {
return this.$store.state.suggest.snackbarStatus;
},
snackbarText() {
return this.$store.state.suggest.snackbarText;
}
위와 같이 작성했더니 Computed property "snackbarStatus" was assigned to but it has no setter. 에러 발생
아래는 해결방법
computed: {
snackbarStatus: {
get() {
return this.$store.state.suggest.snackbarStatus;
},
set() {
}
},
snackbarText: {
get() {
return this.$store.state.suggest.snackbarText;
},
set() {
}
},
},
json 구조를 재구조화
reFontData () {
let font = this.fontData;
if(font === undefined || typeof font === "undefined" || font === null || font === ""){
}else {
let value = [];
Object.keys(font).forEach(function (arrayIndex) {
value.push(font[arrayIndex]);
});
return value;
}
},