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>

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

相关推荐
欧阳天风几秒前
vue3的组件优化
前端·vue.js·性能优化
打瞌睡的朱尤几秒前
蓝桥杯复习大纲
前端·javascript·vue.js
凯尔萨厮1 分钟前
Spring学习笔记(基于注解)
笔记·学习·spring
许彰午1 分钟前
# Excel转PDF合并单元格边框错乱?jxl+iText逐格解析样式,政务报表精准还原方案
前端·javascript·pdf
某风吾起2 分钟前
通过mmwave studio配置TI毫米波雷达IWR1843的StaticConfig
嵌入式硬件·学习
EnglishJun5 分钟前
ARM嵌入式学习(二十二)-- 操作系统的中断处理以及ioctl
学习
南無忘码至尊8 分钟前
Unity学习90天-第3天-认识触屏输入(手游基础)并完成手机点击屏幕,物体向点击位置移动
学习·unity·c#·游戏引擎·游戏开发
灯光设计师12 分钟前
JavaScript判断受访域名,调用不同的js文件
javascript
聊聊MES那点事12 分钟前
报表控件Stimulsoft Reports.NET使用教程:发票报告设计
前端·javascript·html·报表工具
青桔柠薯片13 分钟前
从字符设备到平台驱动:IMX6ULL LED 与蜂鸣器驱动开发学习总结
驱动开发·学习·imx6ull