I begin to study vue, the question arose of how to write data from input entered by the user into the namesThatRhyme array, in the form of value:введенные данные , because now I get that when I select and input data, the same data appears in other inputs.
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Test</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.3.0/semantic.min.css"> <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.13/vue.min.js"></script> <script src="https://unpkg.com/semantic-ui-vue/dist/umd/semantic-ui-vue.min.js"></script> <script src="/home/ramis/project/lab/vue js/js/vue.js"></script> </head> <style> input { display: block; margin: 5px 0 10px 0; } </style> <body> <div style="margin: 120px;" id="app_form"> <p>A list of names that rhyme: {{namesThatRhyme}}</p> <label> <input type="" value="Daniel" v-model="namesThatRhyme" placeholder="Daniel" /> </label> <label> <input type="" value="Nathaniel" v-model="namesThatRhyme" placeholder="Nathaniel" /> </label> <label> <input type="" value="Hubert" v-model="namesThatRhyme" placeholder="Hubert" /> </label> </div> <script> var app2 = new Vue({ el: '#app_form', data() { return { namesThatRhyme: [] } } }) </script> </body> </html>