xvedivoes是什么

转载

mob64ca1408d5ff 2024-07-09 22:19:16

文章标签 xvedivoes是什么 Vue html 官网 文章分类 架构后端开发

(一) Vue 概念理解

(1) Vue.js 是什么

Vue (读音 /vjuː/，类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。

(2) 渐进式框架是什么

看了一些教程以及文章，简单理解的渐进式框架就三个字【不强求】，Vue并不强求你用它的所有内容（功能特性），用户完全可以根据自己情况进行选择，使用其部分即可。

(二) Vue 的优点

1、体积小

压缩后33K

2、更高的运行效率

基于虚拟dom一种可以预先通过 javascript 进行各种计算,把最终的 DOM操作计算出来并优化的技术，由于这个DOM操作属于预处理操作，并没有真实的操作DOM，所以叫做虚拟DOM。

3、双向数据绑定

让开发者不用再去操作 dom 对象，把更多的精力投入到业务逻辑上

4、生态丰富、学习成本低

市场上拥有大量成熟、稳定的基于 vue.js 的 ui 框架、常用组件！
拿来即用实现快速开发
对初学者友好、入门容易、学习资料多

(三) 入门案例

首先我们需要引入 Vue，你可以去官网直接 down 下文件，进行一个本地的引入，类似引入 jQuery，或者使用一个网络的引用，例如下文中，在官网中就可以找到这种引入或下载的地址

可以看到，引入后，我们通过 new 的这种形式创建了一个 Vue 的实例，其中通过 el 找到 id 值为 hello 的 div 进行绑定，在 data 中进行一个赋值，而在div 中通过两组大括号来对数据进行回显

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
</head>
<body>
<div id="hello">
  <h2>{{content}}</h2>
</div>
<script>
  var vm = new Vue({
      el: "#hello",
      data:{
        content: "Hello Vue!"
      }
  })
</script>
</body>
</html>

xvedivoes是什么_官网