Web开发

首页 » 常识 » 预防 » 融职教育Web前端学习第7章Vue基
TUhjnbcbe - 2023/10/6 19:13:00
北京哪家医院治疗白癜风正规 https://jbk.39.net/yiyuanzaixian/bjzkbdfyy/

一、elementUI概述

elementUI是一个基于Vue的UI库。学习UI库最简单的方式就是去看它的文档。

二、安装elementUI

推荐使用npm的方式安装,它能更好地和webpack打包工具配合使用。

在项目的根目录打开命令行输入:

npminstallelement-ui--save

importVuefromvue;importAppfrom./App.vue;importElementUIfromelement-ui;importelement-ui/lib/theme-chalk/index.css;Vue.use(ElementUI);newVue({el:#app,render:h=h(App)});

安装完成之后,就可以像下面的示例代码一样,直接使用elementUI提供的组件了。

el-button默认按钮/el-button

三、常用组件介绍

表单组件

表格组件

消息提示

总结

关于elementUI的组件,了解一些常用的即可,以后工作中,随时都可以根据需求去查找文档。

四、课后练习

使用ElementUI实现一个用户注册功能,点击注册按钮,在控制台输出所有注册用户的信息,信息具体内容如下:用户名密码邮箱性别兴趣爱好:篮球、足球、羽毛球。使用ElementUI实现一个表格数据的添加与删除。

1
查看完整版本: 融职教育Web前端学习第7章Vue基