I spent almost the whole week on code refactoring. It is a process which takes up quite a lot of time as much thinking is needed to optimize the code for easier maintenance in the future. My progress on refactoring was satisfactory, except for a small part where I am slightly stuck.
In VueJs, v-model is a feature for two way data binding. This means that a variable is binded to an event listener. A change in input will generate an event and thus changes the value of that particular variable. However, when I try to create a component which includes v-model, it doesn’t work. The value of the variable does not change accordingly. Based on the documentation by Vue, in order to incorporate v-model into a component, a prop “value” must be binded using v-bind, followed by implementation of an event emitter “$emit.target.value”. That didn’t work for me as it generated an error of “target.value undefined”. I was slightly confused as I had already passed the “value” prop. I had yet to figure out the solution and will continue working on this the following week.