javascript - 绑定(bind)到vue框架

标签 javascript vue.js

这是一个代码:

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Vue</title>
</head>

<body>
    <div id="root">
        <input v-model="message" placeholder="Msg">
        <p>Message you typed is: {{ message }}</p>
    </div>
    <script src="https://unpkg.com/vue@2.6.10/dist/vue.js"></script>
    <script>

        new Vue({
            data: {
                el: '#root',
                message: ''
            }
        });
    </script>
</body>
</html>

为什么绑定(bind)不起作用。我尝试从视频

https://laracasts.com/series/learn-vue-2-step-by-step/episodes/1 . 

谢谢

最佳答案

el 键应该位于传递给 Vue 构造函数的对象上,而不是位于 data 对象内 ( Reference )

new Vue({
  el: '#root',
  data: {
    message: ''
  }
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<div id="root">
  <input v-model="message" placeholder="Msg">
  <p>Message you typed is: {{message}}</p>
</div>

关于javascript - 绑定(bind)到vue框架,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/59261830/

相关文章:

javascript - NUXT 警告 "Emitted value instead of an instance of Error"是关于什么的?

javascript - 在 svg 中添加图像

javascript - React-Native:如何增加文本和下划线之间的空间

javascript - Webpack - 忽略 require() 中的加载器?

javascript - 移相器 : How to use a simple timer from 0 to 3

javascript - 淡入原始元素而不显示辅助元素?

javascript - foreach 表行除以 5

javascript - 我无法让 Rails5.2 编译 Vue.js

vue.js v-for 在两个表行上

javascript - 将接收到的 JSON 打印到表中