Vue的学习之数据与方法

前段期间,由于入职原因没有学习,现在已经正式入职啦,接下来继续加油学习。

一、数据与方法

文字备注已经在代码中,方便自己学习和理解

html 复制代码
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script src="vue.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body>
		<!-- 视图 -->
		<div id="app">
			{{a}}
		</div>
		<!-- 脚本 -->
		<script type="text/javascript">
			// 声明一个字典对象
			var data = {
				a: 1
			};
			// 用new声明一个Vue的示例对象
			var vm = new Vue({
				el: "#app",
				data: data
			});
			// $是表示VUE中的属性和方法,
			// 为了与自己定义的属性和方法区分开来
			// $watch是表示监听,第一个值表示监听的对象
			// 第二个时表示监听的回调函数
			vm.$watch('a', function(newVal, oldVal) {
				console.log(newVal, oldVal);
			})
			// 将vm中的data属性中的a的值进行了更改
			vm.$data.a = "Ryan"
		</script>

	</body>
</html>

本节学习完毕,接下来进入下一节学习!!!

相关推荐
+VX:Fegn089543 分钟前
计算机毕业设计|基于springboot + vue图书管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
智行众维1 小时前
【用户心得】SCANeR™Studio学习笔记(六):人因工程Pack——一站式搞定驾驶模拟的多模态数据同步
笔记·学习·自动驾驶·汽车·仿真·scaner·人因工程
kissgoodbye20121 小时前
cadence学习之基础知识
网络·学习
xian_wwq1 小时前
【学习笔记】基于人工智能的火电机组全局性能一体化优化研究
人工智能·笔记·学习·火电
阿蒙Amon1 小时前
JavaScript学习笔记:6.表达式和运算符
javascript·笔记·学习
小a杰.2 小时前
Flutter 设计系统构建指南
开发语言·javascript·ecmascript
potato_15542 小时前
Windows11系统安装Isaac Sim和Isaac Lab记录
人工智能·学习·isaac sim·isaac lab
我命由我123453 小时前
python-dotenv - python-dotenv 快速上手
服务器·开发语言·数据库·后端·python·学习·学习方法
点云SLAM4 小时前
Proper 英文单词学习
人工智能·学习·英文单词学习·雅思备考·proper·合规范 / 合适 /·正确 / 真正的
Jerry.张蒙4 小时前
SAP业财一体化实现的“隐形桥梁”-价值串
大数据·数据库·人工智能·学习·区块链·aigc·运维开发