Vue介绍
Vue.js 设计的初衷就包括可以被渐进式地采用。这意味着它可以根据需求以多种方式集成到一个项目中。
将 Vue.js 添加到项目中主要有四种方式:
- 在页面上以 CDN 包的形式导入。
- 下载 JavaScript 文件并自行托管。
- 使用 npm 安装它。
- 使用官方的 CLI 来构建一个项目,它为现代前端工作流程提供了功能齐备的构建设置 (例如,热重载、保存时的提示等等)。
发布版本说明
最新版本 v3.2.6
官方网站:https://v3.cn.vuejs.org/guide/installation.html
安装
- cdn方式
- Vite方式
本教程使用以下两种方式进行安装
- cdn方式使用
-
对于制作原型或学习,你可以这样使用最新版本:
<script src="https://unpkg.com/vue@next"></script>
对于生产环境,我们推荐链接到一个明确的版本号和构建文件,以避免新版本造成的不可预期的破坏
- 简单的使用例子
-
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <body> <script src="https://unpkg.com/vue@next"></script> <div id="couter"> <!--{{}}告诉Vue这里面放的是一个变量--> <p>{{num}}</p> <p>{{uname}}</p> </div> <script> const couter={//配置对象 data :function(){ return{ num : 0, uname : '张三' } } } Vue.createApp(couter).mount("#couter")//创建应用,传入配置对象,mount挂载 </script> </body> </html>
© 版权声明
THE END
暂无评论内容