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>

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

相关推荐
change_fate12 小时前
vite 修改base之后需要修改public路径
javascript·vue.js
Purple Coder13 小时前
Pytorch框架
学习
EmbedLinX13 小时前
嵌入式Linux根文件系统制作与移植
linux·服务器·笔记·学习
百锦再13 小时前
线程安全的单例模式全方位解读:从原理到最佳实践
java·javascript·安全·spring·单例模式·kafka·tomcat
程序员林北北13 小时前
【前端进阶之旅】一种新的数据格式:TOON
前端·javascript·vue.js·react.js·typescript·json
linux_cfan13 小时前
Chrome 彻底封杀 Flash 后,安防监控如何实现 RTSP 流无插件播放?(2026解决方案)
javascript·安全·实时音视频·html5
知识分享小能手14 小时前
SQL Server 2019入门学习教程,从入门到精通,SQL Server 2019 存储过程与自定义函数 — 语法知识点及使用方法详解(15)
数据库·学习·sqlserver
强子感冒了14 小时前
Javascript学习笔记:BOM和DOM
javascript·笔记·学习
Never_Satisfied14 小时前
在c#中,抛出异常,并指定其message的值
java·javascript·c#
Highcharts.js14 小时前
什么是散点图?一文学会Highcharts散点图的核心特性与3D扩展应用
javascript·3d·开发文档·散点图·highcharts·图表类型