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>

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

相关推荐
超人不会飞_Jay3 分钟前
2026.6.4 Vue用户中心项目笔记
前端·vue.js·笔记
时寒的笔记6 分钟前
瑞数案例欧冶解读py和js文件最终版
开发语言·javascript·ecmascript
怕浪猫10 分钟前
Electron 开发实战(十):应用打包与分发|全平台打包、签名、自定义协议实战
前端·javascript·electron
txh050711 分钟前
串口数据调试-直观表示
嵌入式硬件·学习
Lucky_ldy13 分钟前
51单片机的学习下(结合中科协的个人自用笔记)
笔记·学习·51单片机
我是伪码农15 分钟前
小程序175-200
前端·javascript·小程序
懂懂tty17 分钟前
Vue3 编译优化
前端·javascript·vue.js
OBiO201321 分钟前
AAV在肠道研究中的应用:从血清型选择到炎症性肠病研究案例解析
学习
段一凡-华北理工大学21 分钟前
工业领域的Hadoop架构学习~系列文章16:实时流处理架构 - 工业数据的实时动脉
大数据·数据仓库·hadoop·分布式·学习·架构·高炉炼铁
MartinYeung522 分钟前
[论文学习]隐私保护联邦学习于入侵侦测系统之调查研究
学习