2021年3月26日

vue中 axios 安装 + post 登录 + get 表单

摘要: npm install axios 安装 import axios from 'axios' 在需要使用的 .vue 文件中引入 get请求:("",{ }) 第一个参数表示请求地址,第二个参数表示配置信息params: 表示传递到服务器端的数据headers: 表示请求头post请求:("",{ 阅读全文

posted @ 2021-03-26 10:50 cropsecrab 阅读(286) 评论(0) 推荐(0)

el-table 表格

摘要: <el-table> 必填: :data="tableData" 可填: size="" // 表格内容整体大小 medium / small / mini :row-style="{height:'80px'}" // 设置表格 行高 :cell-style="{}"也可以,注意!冒号和单引号 : 阅读全文

posted @ 2021-03-26 10:13 cropsecrab 阅读(232) 评论(0) 推荐(0)

el-form 表单

摘要: <el-form> ** 必须设置: :model="Form" ref="Form" ** 可以设置: :rules="rules" // 创建验证表单 :inline=true // 创建行内表单 inline-message // 以行内形式展示校验信息 默认为false size=" " / 阅读全文

posted @ 2021-03-26 09:50 cropsecrab 阅读(763) 评论(0) 推荐(0)

2021年3月25日

el-pagination 分页

摘要: el-pagination: <div class="block"> <span class="demonstration">直接前往</span> <el-pagination v-model:currentPage="currentPage" :page-size="10" //每页展示的条数 阅读全文

posted @ 2021-03-25 17:27 cropsecrab 阅读(62) 评论(0) 推荐(0)

2021年3月17日

el-tag 标签 + 点击菜单栏添加对应标签 + 点击标签跳转菜单栏变蓝

摘要: el-tag: <el-tag v-for="tag in tags" //循环 :key="tag.index" // closable //可关闭 @close="handleClose(tag)" //关闭方法 @click="handleClick(tag)" //点击标签 :effect= 阅读全文

posted @ 2021-03-17 15:52 cropsecrab 阅读(1848) 评论(0) 推荐(0)

vue使用 screenfull 插件实现网页全屏 + aside 和 main 对应高度变化

摘要: 1、安装screenfull插件,在终端中输入:npm install screenfull --save 2、在需要使用全屏的 .vue 文件的script中引入:import screenfull from 'screenfull'; 3、设置触发事件 和 函数调用 <template> //设 阅读全文

posted @ 2021-03-17 14:40 cropsecrab 阅读(518) 评论(0) 推荐(0)

固定顶部 el-header + 左侧 el-aside 滚动条 + 主体 el-main 滚动条

摘要: 头部设置高度: .el-header { height: 70px !important; } ***不需要定位,只用设置高度固定,滚动条就分别出现在各自部位,头部就固定了*** 左侧: .el-aside { height: calc(100vh - 70px); // vh就是当前屏幕可见高度的 阅读全文

posted @ 2021-03-17 11:31 cropsecrab 阅读(4545) 评论(0) 推荐(1)

2021年3月16日

菜单栏 menu + 与侧边栏 aside 实现叠收

摘要: menu 的基本使用: //munu中提供 //mode="horizontal" 菜单方式改为水平,默认为竖直 (vertical) 方向 //background-color="" text-color="" active-text-color="" 背景颜色、文字颜色、点击的颜色 //:uni 阅读全文

posted @ 2021-03-16 15:22 cropsecrab 阅读(1582) 评论(0) 推荐(0)

2021年3月15日

vue中 route 路由的用法 + 实现点击跳转

摘要: vue中路由的用法: const routes = [ { path: "/", redirect: '/welcome' }, { path: "/welcome", component: home, children:[ { path: "/welcome" ,component: welcom 阅读全文

posted @ 2021-03-15 15:08 cropsecrab 阅读(1480) 评论(0) 推荐(0)

vite搭建vue项目 + element plus + 路由router + 全局样式布置

摘要: vitevite搭建vue项目 windows + R 输入cmd 进入终端 cd.. cd D:\Vue\vite\text 进入要创建项目的文件夹下 npm init @vitejs/app 进入用vite搭建项目 // npm init @vitejs/app my-vue-app --tem 阅读全文

posted @ 2021-03-15 13:49 cropsecrab 阅读(1961) 评论(0) 推荐(0)

导航