根据vue官方文档,官方提供了两种方式来使用vue框架。
创建一个html文件,然后在其中通过如下两种方式引入 Vue:
<!-- 开发环境版本,包含了有帮助的命令行警告 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script>
可以简单理解为完整版本,适合初学者使用。
<!-- 生产环境版本,优化了尺寸和速度 -->
<script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
可以简单理解为mini版本,部分代码被压缩,速度更快。
以上方式二选一后,接下来:
在HTML中引入如下代码
<div id="app">
{{ message }}
</div>
在js中引入如下代码
var app = new Vue({
el: '#app',
data: {
message: 'Hello Vue!'
}
})
完成以上操作后,开始使用vue的基本操作就完成了。
最终效果图如下:
版权归原作者 Bule Guy 所有, 如有侵权,请联系我们删除。