Vue入门实例

最新推荐文章于 2023-10-16 12:32:14 发布

程裕强

最新推荐文章于 2023-10-16 12:32:14 发布

阅读量307

点赞数

分类专栏： VUE

本文链接：https://blog.csdn.net/chengyuqiang/article/details/103344435

版权

VUE 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>Vue入门实例</title>
	<script src="https://vuejs.org/js/vue.min.js"></script>
</head>
<body>
	<div id="vue_div">
		<h1>site : {{site}}</h1>
		<h2>url : {{url}}</h2>
		<h3>{{details()}}</h3>
	</div>
	<script type="text/javascript">
		var vm = new Vue({
			el: '#vue_div',
			data: {
				site: "CSDN博客",
				url: "https://blog.csdn.net/chengyuqiang",
				title: "励志："
			},
			methods: {
				details: function() {
					return  this.title + " 1.01^365=37.78，0.99^365=0.025！";
				}
			}
		})
	</script>
</body>
</html>

说明：

Vue 构造器中有一个el 参数，它是 DOM 元素中的 id
data 用于定义属性，methods 用于定义的函数
{{ }} 用于输出对象属性和函数返回值。

在这里插入图片描述

程裕强

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Vue入门实例

<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>Vue入门实例</title> <script src="https://vuejs.org/js/vue.min.js"></script></head>&lt...
复制链接

扫一扫