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>

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

相关推荐
身如柳絮随风扬3 分钟前
Docker 化部署 Spring Boot + Vue 全栈应用:从打包到容器化上线
vue.js·spring boot·docker
魔法阵维护师6 分钟前
从零开发游戏需要学习的c#模块,第二十三章(粒子效果 —— 让游戏“活”起来本课目标)
学习·游戏·c#
迁旭9 分钟前
Claude Code /status 功能技术文档
前端·javascript·人工智能·react.js·机器学习·gpt-3·文心一言
Shan12059 分钟前
三分查找经典实例分析与学习
学习
心中有国也有家11 分钟前
CANN 学习新范式:cann-learning-hub 如何让昇腾入门不再「劝退」
人工智能·经验分享·笔记·学习·算法
星星~笑笑12 分钟前
react Next.js oss上传 上传阿里云
javascript·react.js·阿里云·js
GISer_Jing13 分钟前
前端全流程求职Skill 攻略
前端·学习·前端框架
_Evan_Yao15 分钟前
数据结构太难了?用画图的方式理解链表和栈和树和图
数据结构·学习·链表
一只大袋鼠16 分钟前
SpringBoot 入门学习笔记(三)Web 开发下篇
spring boot·笔记·学习
承渊政道17 分钟前
Linux系统学习【进程概念从入门到深入理解】
linux·服务器·笔记·学习·ubuntu·系统架构·bash