青戈springboot+Vue 项目笔记

01.搭建Vue项目
 

一.环境准备

1.安装 node.js

下载地址：Node.js 

  

（注意node版本过高可能会有影响）

查看版本号即安装成功： node-v   npm -v

2、全局安装脚手架 vue-cli

使用 vue-cli 可以快速创建 vue 项目

在命令行输入：

npm install vue-cli -g （vue-lcli2)
npm install -g @vue/cli (vue-cli3）

输出版本号说明安装成功  vue --version

3.安装cnpm

   点击进入淘宝的cnpm网站,里面有详细的配置方法。 或者直接在命令行输入：

npm install -g cnpm --registry=https://registry.npm.taobao.org

二、创建 vue 项目

新建文件 地址栏输入cmd调出命令窗口（）

vue create xxx（项目名小写字母）

选最后一个自定义版本 

完成后 cd 项目 npm run serve / dev

三.引入elment-ui插件

vue2版本的 执行npm i element-ui -S

版本号在package.json文件中可以查看

02.搭建页面布局相关知识点记录

导航栏

1.参差不齐的情况：在el-mean的style里面加overflow：hidden

 

2.选中高亮  active-text-color="#ffd040"

3.给导航栏加展开/收起功能

el-mean添加:collapse = "isCollapse"

data里return

 

js里面：

单击之后图标互换

4.导航栏加动态宽度

 

5.解决导航栏收起时文字还在的问题: 

 

原代码:

修改后:  用span标签吧导航包住

 ok啦~

6.菜单栏阴影效果 box-shadow 

该属性可设置的值包括阴影的 X 轴偏移量、Y 轴偏移量、模糊半径、扩散半径和颜色。

    

7.输入框里面右侧加图标

 suffix-icon="el-icon-search"

 输入框里面左侧加图标：

prefix-icon="el-icon-search"

 8.给table表头加颜色

:header-cell-style="{ background: '#EEF1F4', color: '#646a73' }

03.搭建SpringBoot项目

快速搭建一个简单的SpringBoot项目-详细步骤_springboot项目搭建流程_是鱼染哟的博客-CSDN博客

阿里云

新建数据库 

04.关于SpringBoot 后台出现的一些问题

测分页接口的时候要注意给参数