javaweb day03

Ajax

原生Ajax（比较繁琐现在用Axios）

Axios

案例

前后端分离开发

介绍

TAPI(接口文档的管理平台)

前端工程化

环境准备

Vue项目简介

Vue项目开发流程

Vue组件库Element

什么是Element

快速入门

官网复制

常见组件

官网复制

分页

官网找分页组件

对话框

表单

案例

<template>

    <div>

        <el-container style="height: 700px; border: 3px solid #eee">

            <el-header style="font-size: 40x; background-color: rgb(238, 241, 246)">Header</el-header>

            <el-container>

                <el-aside width="200px">

                    <el-menu :default-openeds="['1', '3']">

                        <el-submenu index="1">

                            <template slot="title"><i class="el-icon-message"></i>系统信息管理</template>

                            <el-menu-item index="1-1">部门管理</el-menu-item>

                            <el-menu-item index="1-2">员工管理</el-menu-item>

                        </el-submenu>

                    </el-menu>

                </el-aside>

                <el-main> <el-table :data="tableData">

                        <el-table-column prop="date" label="日期" width="140">

                        </el-table-column>

                        <el-table-column prop="name" label="姓名" width="120">

                        </el-table-column>

                        <el-table-column prop="address" label="地址">

                        </el-table-column>

                    </el-table></el-main>

            </el-container>

        </el-container>

    </div>

</template>

<script>

export default {

}

</script>

<style></style>

Vue路由

打包部署