InterviewSolution
| 1. |
While juggling through the world of development using vue.js, you are required to use a two-way data binding between the data attribute and an input box. How would you implement this? |
|
Answer» Two-way data binding refers to data sharing between components class and the template. Two way binding is a powerful tool for developing JavaScript patterns. For instance when one side is changed, the other also CHANGES to match the other. When a value is altered or changed in the input box, the value of the component class also changes. The best way to implement two-way data binding is by the use of v-model. V-model is essential as it allows updating of data. V-model assumes VUE instance as the primary source of data and thus it ignores initial checked, selected or value attributes. The initial VALUES only need to be declared in the JavaScript. For instance: <input type=”text” :value=”nameInput” @keyup= “nameInput = $EVENT.target.value”>The data attribute ‘nameInput’ is assigned the input box when there is an event in ‘keyup’. This way, we are binding the input box to the data attribute and that is how two-way binding is achieved. There is a firm RELATIONSHIP flanked by the form field and information property. Compared to manual setup, v-model handles the process quicker and more efficiently. |
|