正文部分

• 配置

vue：3.0

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。

耶，又学习到了一个新知识点。

又是一个向阳而生的一天。

じゃね