Vue入门:第一个程序

尝试 Vue.js 最简单的方法是使用 Hello World 例子。然后通过如下方式引入 Vue:


起步

对于制作原型或学习,你可以这样使用最新版本:

<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>

对于生产环境,我们推荐链接到一个明确的版本号和构建文件,以避免新版本造成的不可预期的破坏:

<script src="https://cdn.jsdelivr.net/npm/[email protected]"></script>

如果你使用原生 ES Modules,这里也有一个兼容 ES Module 的构建文件:

<script type="module">
  import Vue from 'https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.esm.browser.js'
</script>

声明式渲染

.html

<div id="app">
  {
   
   { message }}
</div>

.js

var app = new Vue({
    
    
  el: '#app',
  data: {
    
    
    message: 'Hello Vue!'
  }
})

运行

在这里插入图片描述

猜你喜欢

转载自blog.csdn.net/qq_43522998/article/details/109604645
今日推荐