Vue + Element-UI使用

最新推荐文章于 2024-03-23 11:32:29 发布

原创

最新推荐文章于 2024-03-23 11:32:29 发布 · 置顶 · 1.2k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#vue

Vue + Element-UI使用

安装element

cnpm i element-ui -S

在vue当中引入element-ui

在main.js中写入以下内容

import ElementUI from 'element-ui';
import 'element-ui/lib/theme-chalk/index.css';

Vue.use(ElementUI);

用element布局页面

1、使用container布局页面，首页引入导航， Index.vue

<template>
    <div>
        <el-container>
            <el-aside width="200px">
                <el-menu router
                    default-active="2"
                    class="el-menu-vertical-demo"
                    @open="handleOpen"
                    @close="handleClose">
                    <el-menu-item index="/home">
                        <i class="el-icon-location"></i>
                        <span slot="title">首页</span>
                    </el-menu-item>
                    <el-submenu index="2">
                        <template slot="title">
                        <i class=