Vue.js呼叫请回答

最新推荐文章于 2023-08-23 13:43:07 发布

snakeZix

最新推荐文章于 2023-08-23 13:43:07 发布

阅读量181

点赞数

分类专栏：打开Vue的正确姿势文章标签： vue javascript

本文链接：https://blog.csdn.net/wucan111/article/details/107617762

版权

打开Vue的正确姿势专栏收录该内容

19 篇文章 0 订阅

订阅专栏

注意：该栏目全部一句Vue.js官网的教程2.x编写

script引入

<!-- 生产环境（上线） -->
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
<!-- 使用最新版本 开发版 供学习 -->
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

MVVM => VM

简单创建一个实例，并显示实例数据的name值

<!-- 上面忽略一大堆 -->
<body>
  <div id="app">{{name}}</div>
</body>
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script>
  const vm = new Vue({
    name: 'App' //给这个vm起个名字（随意的）
    el: '#app', //要绑定的元素
    data: {     //绑定的响应数据 
      name: 'zix'
    }
  })
</script>
<!-- 下面忽略一大堆 -->

实例参数的data数据会对应到实例的getter和setter方法，代理数据

const data = {     
  name: ''
}
const vm = new Vue({
  name: 'App' //给这个vm起个名字（随意的）
  el: '#app', //要绑定的元素
  data        //绑定的响应数据 
})
//注意式data的数据是响应的
console.log(vm.name) // => 'zix' getter方法
vm.name = 'wucan' // => data.name === 'wucan' setter方法