title: Vue.JS - Combine Variable
body: <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code> 
      &lt;script&gt;
      var app = new Vue ({
          el: '#app',
          
          data : {
              sentence: ''
          },
        
              
          methods: {
              
              Q: function () {
                  this.sentence = "Q"
              },
              
               W: function () {
                  this.sentence = "W"
              },
              
               E: function () {
                  this.sentence = "E"
              },
              
               R: function () {
                  this.sentence = "R"
              },
              
               T: function () {
                  this.sentence = "T"
              },
              
               Y: function () {
                  this.sentence = "Y"
              }
              
          } 
          
      })
          
      
      &lt;/script&gt;
      </code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>  &lt;div id="app"&gt;
     &lt;p&gt;Sentence : {{ sentence }}&lt;/p&gt;
      &lt;button @click="Q"&gt;Q&lt;/button&gt;
      &lt;button @click="W"&gt;W&lt;/button&gt;
      &lt;button @click="E"&gt;E&lt;/button&gt;
      &lt;button @click="R"&gt;R&lt;/button&gt;
      &lt;button @click="T"&gt;T&lt;/button&gt;
      &lt;button @click="Y"&gt;Y&lt;/button&gt;
     
     &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>The program is working. But first of all the user click 'Q' and after that click 'W', the input seems 'W' , i want this input: &quot;QW&quot; , it should be combine.</p>
  <p>For example the user click Q, W and E, the input should be &quot;QWE&quot;. How can i combine all of them? Maybe its easy but i couldnt find anywhere. I am beginner on VueJS</p>
  <p>Can you help me?</p>