- 博客(36)
- 收藏
- 关注
原创 Vue基础
一、初识Vue初识Vue: 1. 想让Vue工作,就必须创建一个Vue实例,且要传入一个配置对象; 2. root容器里的代码依然符合html规范,只不过混入了一些特殊的Vue语法; 3. root容器里的代码被称为【Vue模板】; 4. Vue实例和容器一一对应的: 5. 真实开发中只有一个Vue实例,并且会配合着组件一起使用: 6. {{xxx}}中的xxx要写js表达式,且xxx可以自动读...
2022-04-22 23:37:04
1281
原创 获取用户列表数据
① created 生命周期函数created() { this.getUserList() },② 在 methods中 定义 getUserList()函数async getUserList(){ const { data:res } = await this.$http.get('user',{ params: this.queryInfo }) if (res.meta.status !== 200){
2022-04-15 22:19:41
549
原创 通过路由的形式展示用户列表组件
<!-- 第一步 挂载:router="true" 开启路由模式 --><el-menu :router="true"></el-menu><!-- 第二步 挂载:router="true" 在index中 写path路径 -->① <el-menu-item index=/user>② <el-menu-item :index= '/' + subItem.path> // 后台获取path值...
2022-04-15 22:14:47
112
原创 实现首页路由的重定向效果
① 新建一个 Welcome.vue② 在 router 中进行导入使用redirect 进行重定向import Welcome from '@/components/Welcome'Vue.use(VueRouter)const routes = [ {path: '/',redirect:'/login'}, {path:'/login',component:Login}, {path:'/home', component:Home, redire.
2022-04-15 20:04:22
809
原创 实现侧边栏的折叠与展开效果
展示效果代码:html:动态绑定 : toggleCollapse 点击事件 改变宽度collapse-transition:是否开启折叠动画collapse:是否水平折叠收起菜单(仅在 mode 为 vertical 时可用)<el-container> <!--侧边栏--> <el-aside :width="isCollapse ? '64px' : '200px'"> <div..
2022-04-15 19:55:38
2501
原创 配置请求的根路径
// 配置请求的根路径// '/spike_moment' 为根路径 可修改axios.defaults.baseURL = '/spike_moment'Vue.prototype.$http = axios
2022-04-15 00:12:25
844
原创 左侧菜单数据
后端接口:前端页面:① 页面加载后显示,调用 created 生命周期created() { this.getMenuList() },② 在 methods 中,定义相关函数 (getMenuList)// 获取所有的菜单 async getMenuList() { const {data:res} = await this.$http.get('menus') if (res.meta.status !== 200) retur
2022-04-15 00:07:32
1406
原创 通过接口获取菜单数据(添加axios请求拦截器)
通过 axios 请求拦截器添加 token, 保证拥有获取数据的权限。(相当于预处理过程)// axios请求拦截axios.interceptors.request.use(config => { // 为请求头对象,添加 Token 验证的 Authorization 字段 config.headeres.Authorization = window.sessionStorage.getItem('token') return config})
2022-04-15 00:00:48
170
原创 语法处理-处理项目中的ESLin语法报错问题
方法一:.eslintrc.js 文件的 rules 中 加入 'space-before-function-paren': 0 rules: { 'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off', 'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off', // 需要添加的语句 'space-b
2022-04-14 19:30:18
442
原创 登录功能实现
3.3 路由导航守卫控制访问权限如果用户没有登录,但是直接通过URL访问特定页面,需要重新导航到登录页面。// 为路由对象,添加 beforeEach 导航守卫router.beforeEach((to,from,next) => { // 如果用户访问的登录页,直接放行 if (to.path === '/login') return next() // 从 sessionStorage 中获得到 保存的 token 值 const tokenStr =
2022-04-14 19:14:51
284
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人