Element学习(入门)(1)

1、Element官网:https://element.eleme.cn/#/zh-CN
2、来源与用处


3、Element的快速入门

(1)

(2)在入口文件(main.js)中引入

(3)


4、快捷键ctrl+c,在当前的项目终端关闭


5、npm安装

注意在当前工程下安装element组件库

输入:npm i element-ui -S
6、Element官网------>快速上手
7、App.vue是我们的根组件,定义其它的组件页面通通放在views目录下


8、通常在views目录下单独再创建一个目录------"element",用来存放element的一些组件。

还有文件命名一般采用驼峰命名


9、.vue结尾的组件文件中有三个部分

(1)<template>(html代码(模板))

(2)<script>(定义vue当中的数据模型和方法)

(3)<style>(定义css当中的代码)

(4)最后的基本结构已经完成,然后接着去element官网复制组件代码,然后调整就可以了


10、tab键调整代码整齐
11、通常都是默认展示根组件文件App.vue里的内容,如何展示自己创建的组件文件的内容?

所以要在根组件文件中去尝试更改和引入。(通过标签引入)


12、初步尝试成功!


13、安装插件很重要,但是我自己的补全不了,不知道为啥。

相关推荐
Ivy烎1 小时前
STM32学习笔记
笔记·stm32·学习
全栈小52 小时前
【前端】Vue3+elementui+ts,给标签设置样式属性style时,提示type check failed for prop,再次请出DeepSeek来解答
前端·elementui
游九尘3 小时前
vue2自定义指令directive用法: dom中关键字文字高亮
前端·vue
八一考研数学竞赛3 小时前
第十七届全国大学生数学竞赛初赛模拟试题
学习·数学·latex·全国大学生数学竞赛
蓝胖子不会敲代码4 小时前
跟着AI学习C# Day12
学习·microsoft·c#
夏沫mds4 小时前
Hyperledger Fabric食品溯源
运维·vue.js·go·vue·区块链·gin·fabric
future14125 小时前
FairyGUI学习
学习·游戏·ui·unity
Chef_Chen5 小时前
从0开始学习R语言--Day27--空间自相关
学习
虾球xz6 小时前
CppCon 2017 学习:10 Core Guidelines You Need to Start Using Now
开发语言·c++·学习
AgilityBaby6 小时前
UE5创建蒙太奇动画并播放和在动画蒙太奇中创建动画通知状态
笔记·学习·ue5·游戏引擎·蓝图·蒙太奇动画