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

<!DOCTYPE html>
<html>
<head>
  <title>购物清单</title>
  <style>form {
      border: dashed black 1px;
      width: 200px;
      padding: 20px;
    }
  </style>
</head>
<body>

<h1>示例：购物清单</h1>
<div id="app">
  <form v-on:submit.prevent="addItem">
    <p>
      你需要什么？
      <input type="text" required placeholder="item name.." v-model="itemName">
    </p>
    <p>
      多少个？
      <input type="number" placeholder="number of items.." v-model="itemNumber">
    </p>
    <button type="submit">新增项目</button>
  </form>

<div>
    <p>购物清单：</p>
    <ul>
      <li v-for="item in shoppingList">{{ item.name }}, {{ item.number}}</li>
    </ul>
  </div>
</div>

</body>
</html>

报个问题: