vue 在线编辑器 | vue代码测试

<!DOCTYPE html>
<html>
<head>
  <title>输入电子邮件地址</title>
  <style>#app {
      border: dashed black 1px;
      width: 200px;
      padding: 0 10px 10px 10px;
    }
    #app > div {
      width: 200px;
      height: 50px;
      border: solid black 1px;
      background-color: lightgreen;
    }
    #app > p {
      font-size: large;
      font-weight: bold;
    }
    .valid {
      color: green;
    }
    .invalid {
      color: red;
    }
  </style>
</head>
<body>

<h1>示例：输入电子邮件地址</h1>
<p>设置观察者来观察电子邮件输入。 如果当前输入的电子邮件地址有效或无效（缺少@），则会通知用户。</p>
<p>如果输入刚刚从键盘的最后一个输入变得有效，也会通知用户。</p>
<div id="app">
  <label>
    <p>输入有效的电子邮件地址:</p>
    <input type="email" v-model="inpAddress">
  </label>
  <p v-bind:class="myClass"><code>{{ feedbackText }}</code></p> 
</div>

</body>
</html>

报个问题: