text里面输入啥,点击提交就显示啥,求解

img


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.12/vue.js"></script>
</head>
<body>
    <div id="app">
        <input v-model="message"><button @click="submit">提交</button>
        <div v-show="isShow">{{message}}</div>

    </div>

</body>
<script>
  var vm = new Vue({
    el:'#app',
      data() {
        return {
            message:'',
            isShow:false
        }

      },
      methods: {
          submit() {
              this.isShow = true
          }
      }
  })
</script>
</html>



<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
</head>
<body>
<input type="text" id="input" />
<button id="button">提交</button>
<p id="p"></p>

<script>
  const inputDom = document.getElementById('input')
  const buttonDom = document.getElementById('button')
  const pDom = document.getElementById('p')
  buttonDom.onclick=function () {
    pDom.innerText=inputDom.value
  }
</script>
</body>
</html>