Vue 自学历程 (一)- 简介 以及 下载

博客介绍了Vue.js的下载链接,阐述了什么是Vue。以将json对象数据显示到元素上为例,对比了不使用Vue(用JS或JQuery操作HTML DOM)和使用Vue(仅提供数据和元素id)的不同方式,指出Vue目标是用简单API实现响应式数据绑定和视图组件组合。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

vue.js  下载:https://pan.baidu.com/s/1JW_bE5m641z40MVDPmqpxQ 提取 9wbb

什么是 Vue? 
考虑这个需求: 我们要把一个 json对象的数据,显示到一个元素上去。
如果不使用 Vue, 那么就会用到 JS 或者 JQuery,通过操作 HTML DOM 的方式,把数据显示上去。
如果使用Vue, 那么仅仅需要提供数据,以及数据要绑定到的元素的id,不需要显式地操作HTML DOM。

Vue 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。

下面给出比较:

JS 方式

<div id="div1">

   

</div>

  

<script>

  

//准备数据

var gareen = {"name":"盖伦","hp":616};

 

//获取 html dom

var div1 = document.getElementById("div1");

 

//显示数据

div1.innerHTML= gareen.name;

  

</script>

VUE 的方式

//首先导入 vue.js 要用到的库(官方,需要联网,也可以使用本地的文件)

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

<div id="div1">
//Vue 表达式-输出  
  {{gareen.name}}

</div>
 
<script>
 
//准备数据
var gareen = {"name":"盖伦","hp":616};

 

//创建一个Vue对象,把数据和对应的视图关联起来
new Vue({
      el: '#div1',
      data: {
        message: gareen
      }
    }) 
</script>

更多内容,点击了解:http://how2j.cn/k/vuejs/vuejs-start/1744.html?p=71911

 

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值