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 分钟前
Warmup 学习率预热详解:为什么训练初期要“先热身再加速”?
深度学习·学习·语言模型
lisw0521 分钟前
人类认知和语言学习中的控制论!
人工智能·学习·数学建模
鱼很腾apoc21 分钟前
【MySQL】 第1期 从核心概念到表约束全解析
linux·c语言·数据库·学习·mysql
踏月了无痕27 分钟前
01写一个简单的API服务
javascript
妖精的羽翼36 分钟前
Web3D(Three.js)应用分级 + 学习路线规划(由浅入深,贴合接单 + 求职)
学习·three.js
志尊宝37 分钟前
Vue3 零基础每日笔记(081):富文本编辑器集成 wangEditor 5——封装
前端·javascript·vue.js·笔记·信息可视化·echarts
志尊宝1 小时前
Vue3 零基础每日笔记(080):Vue3 + ECharts 数据可视化——封装可复用图表组件
前端·javascript·vue.js·笔记·信息可视化·echarts
斯内普吖1 小时前
(开源)校园充电宝租借管理系统实战指南 基于 Java + SSM + Vue + MySQL
java·vue.js·mysql·开源
2603_965896621 小时前
JS ES6常用新特性|let/const、解构赋值、展开运算符
前端·javascript·es6
衡石科技2 小时前
一个门户只保留一个智能助理:衡石嵌入式 Data Agent 的运行与渲染边界
前端·javascript·html·data agent