vue.js前端框架的详解

最新推荐文章于 2024-01-04 22:31:07 发布

ConfidentWU

最新推荐文章于 2024-01-04 22:31:07 发布

阅读量1.1k

点赞数 1

分类专栏： javascript 前端

本文链接：https://blog.csdn.net/mengtianqq/article/details/79805172

版权

前端同时被 2 个专栏收录

18 篇文章 0 订阅

订阅专栏

javascript

8 篇文章 0 订阅

订阅专栏

vue.js前端框架的详解：

vue.js是什么：

vue一套用于构建用户界面的渐进式框架。与其他框架不同的是，vue被设计为可以自底向上逐层应用。vue的核心库只关注视图层，不仅易于上手，还便于与第三方库或者既有项目整合。另一方面，当与现代化的工具类以及各种支持类结合使用时，vue也完全能够为复杂的单页应用提供驱动。

vue怎么用：

1.引用库

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

2.给定范围

//vue在id="vue_det"的div范围下作用
	<div id="vue_det">

3.赋值数据

//在{{}}中给设定的值
		<h1>{{site}}</h1>

例子代码：

<html>
<head>
<script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>
//vue在id="vue_det"的div范围下作用
	<div id="vue_det">
		//在{{}}中给设定的值
		<h1>{{site}}</h1>
		<h1> {{url}}</h1>
		<div>{{details()}}</div>
	</div>
	//创建一个vue的实例，绑定一定的数据，
	<script type="text/javascript">
		var vm = new Vue({
			el: '#vue_det',
			data: {
				site: "测试",
				url: "留",
				alexa: "2222"
			},
			methods: {
				details: function() {
					return  this.site + " - 都是有梦想的人！";
				}
			}
		})
	</script>
</body>
</html>

例子结果：

测试

留

测试 - 都是有梦想的人！

ConfidentWU

关注

1
点赞
踩
2

收藏

觉得还不错? 一键收藏
1
评论
vue.js前端框架的详解

vue.js前端框架的详解：vue.js是什么： vue一套用于构建用户界面的渐进式框架。与其他框架不同的是，vue被设计为可以自底向上逐层应用。vue的核心库只关注视图层，不仅易于上手，还便于与第三方库或者既有项目整合。另一方面，当与现代化的工具类以及各种支持类结合使用时，vue也完全能够为复杂的单页应用提供驱动。vue怎么用：1.引用库&lt;script s...
复制链接

扫一扫