昨天入门Vue3搞了一个HelloWorld玩玩,今天还是准备从官网的例子入手学习,不管什么框架,官网的例子和文档是最先要学习的。
Vue3的组件渲染方式应该有几种,最简单直观的一种组件渲染方式就是声明式渲染,说白了就是用html按照Vue的模板语法定义一个组件模板。
上模板代码
<!--定义一个简单的html模板-->
<div id="counter">
Counter: {
{ counter }}
</div>
定义一个Vue组件
此处最重要的是要搞明白组件里的两个方法data()和mounted(),data方法会被Vue框架在创建组件实例的过程中悄悄调用,data方法返回一个Json键值对对象,该对象会在组件的$data属性里也存一份。而mounted方法是Vue组件生命周期中的一个钩子方法,Vue组件生命周期除了mounted方法外还有beforeCreate、created、beforeMount、mounted、beforeUpdate、updated、activated、deactivated、beforeUnmount、unmounted、errorCaptured、rend