vue-cli:4.5.11
目的利用element-ui绘制ui界面
(1)安装element-ui

npm i element-ui -S
(2)导入element-ui
import ElementUI from 'element-ui';import 'element-ui/lib/theme-chalk/index.css';Vue.use(ElementUI);
界面空缺,报错如下
Uncaught TypeError: Cannot read property 'prototype' of undefined
报错缘故原由:目前element-ui只支持2.6以下的版本,Vue3.0要利用element-ui就要利用element-plus
官网说法便是为vue-cli@4.5以上供应element-plus
办理方法:参考element-ui官网
https://element-plus.gitee.io/#/zh-CN/component/quickstart
(1)安装element-plus
npm i element-plus
(2)导入element-plus
import ElementPlus from 'element-plus';import 'element-plus/lib/theme-chalk/index.css';const Vue = createApp(App)Vue.use(ElementPlus)
这样就办理了!
vue的生命周期
vue每个组件都是独立的,每个组件都有一个属于它的生命周期,从一个组件创建、数据初始化、挂载、更新、销毁,这便是一个组件所谓的生命周期。
组件中的详细方法:beforeCreate created beforeMount mounted beforeUpdate updated
beforeDestroy destroyed
统共分为8个阶段创建前/后,载入前/后,更新前/后,销毁前/后。创建前/后:
在beforeCreated阶段,vue实例的挂载元素$el和数据工具data都为undefined,还未初始化。
在created阶段,vue实例的数据工具data有了,$el还没有。载入前/后:
在beforeMount阶段,vue实例的$el和data都初始化了,但还是挂载之前为虚拟的dom节点,data还未更换。
在mounted阶段,vue实例挂载完成,data成功渲染。更新前/后:
当data变革时,会触发beforeUpdate和updated方法。销毁前/后:
beforeDestory是在vue实例销毁前触发,一样平常在这里要通过removeEventListener解除手动绑定的事宜。实例销毁后,触发的destroyed。
耶,又学习到了一个新知识点。
又是一个旭日而生的一天。
じゃね