注:为了本教程的准确性,部分描述引用了官网及网络内容。
安装Vue
1、使用npm安装vue:
npm install vue
2、下载使用js文件:
https://vuejs.org/js/vue.min.js
Vue概念
Vue (读音 /vju?/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。
Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。
由于其响应式设计依赖于ES6中的一些特性,因此Vue 不支持 IE8 以及更低版本浏览器(ES5)。
初始化
每个 Vue 应用都需要通过实例化 Vue 来实现。
1 var vm = new Vue({ 2 // 选项 3 })
范例:
1 <div id="vue_det"> 2 <h1>name : {{name}}</h1> 3 <h1>{{details()}}</h1> 4 </div> 5 <script type="text/javascript"> 6 var vm = new Vue({ 7 el: ‘#vue_det‘, 8 data: { 9 name: "Jimmy" 10 }, 11 methods: { 12 details: function() { 13 return this.name + " welcome! "; 14 } 15 } 16 }) 17 </script>
执行结果:
data 用于定义属性,实例中有三个属性分别为:site、url、alexa。
methods 用于定义的函数,可以通过 return 来返回函数值。
{{ }} 用于输出对象属性和函数返回值。
原文地址:https://www.cnblogs.com/JHelius/p/11684069.html
时间: 2024-10-07 12:13:27