title: How to display input value in div when input value changes in VueJS?
body: <p>I would like, to capture the value of my input and display on another div. </p>
  
  <p>Look my code : </p>
  
  <p>If you look the code, I save the value in function msgFunc, and after that I would apply this result in my variable msg, but I don't understand.</p>
  
  <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>export default {
          data () {
              return {
                  msg: ''
              }
          },
          computed: {
              msgFunc: () =&gt; {
                  return this.value
              }
          }
      }</code></pre>
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.flex {
          display: flex;
          flex-flow: row wrap;
          justify-content: center;
          align-items: center;
          height: 90%;
      }
      .input-container {
          width: 410px;
          background-color: #fff;
          padding: 2px 15px 20px 15px;
          box-shadow: 0 16px 24px 2px rgba(0,0,0,0.14), 0 6px 30px 5px rgba(0,0,0,0.12), 0 8px 10px -5px rgba(0,0,0,0.3);
          transition: transform .1s ease-in-out;
      }
      .input-container input {
          margin-top: 10px;
          width: 100%;
          border-bottom: 1px solid #25A3FF;
          padding: 10px 0;
          font-size: 16px;
          color: #929292;
      }
      input:focus {
          outline: none;
      }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="flex"&gt;
          &lt;section class="input-container"&gt;
              &lt;input type="text" v-model="msg" @change="msgFunc" placeholder="Type your HEX color"&gt;
              &lt;h3&gt;{{msg}}&lt;/h3&gt;
          &lt;/section&gt;
      &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>