Vue 3 - 01 测试实例

4/25 Vue 3 教程

vue 只关注是视图层,采用自底向上增量开发的设计。
vue 的目标是通过尽可能简单的API实现响应的数据绑定和组合的视图组件。

<!DOCTYPE html>
<head>
	<meta charset="urf-8">
	<title>Vue 测试实例</title>
	<script src="https://unpkg.com/vue@next"></script>
</head>
<body>
	<div id="hello-vue" class="demo">
		{{message}}
	</div>
</body>
<script>
	const HelloVueApp = {
		data() {
			return {
				message: "Hello, Vue!"
			}
		}
	}
	Vue.createApp(HelloVueApp).mount('#hello-vue')
</script>
</html>

感觉vue的组件定义方式有点像是一个匿名函数赋值的方式:

1,声明一个对象const xxx;

2,对象的结构由各种函数组成,每个函数的返回值也默认以对象形式返回;

3,对这个对象的使用,即是把该对象绑定到对应的选择器上。

凡所有相,皆是虚妄。

推荐阅读