render: h => h('router-view') } export const asyncRouterMap = [{ path: '/', name: 'index', component: BasicLayout, meta: { title: 'menu.home' }, redirect: '/dashboard/workplace'
核心思路:这个方法充分利用了vue中v-show的特性,v-show就类似于css中的visiable,当v-show为false时,它并不会显示出来,但实际上还是保存在dom树中,并不会被销毁。所以就可以实现保留状态。 核心代码 route的配置 { path: '/iframes', name: 'iframes', redirect: '/iframes/baidu', component: KeepAliveRou...
简介: 【Ant Design Pro】使用ant design pro做为你的开发模板(二)新增一个页面与如何添加国际化 接上章,我们到第一章结束已经成功的拉取了项目并运行了项目。 这时候我们会说,如果我们要开始二次开发,那么我们需要改什么呢? 一:如何新增一个页面 1. 新增页面与我们往常开发Vue 或者 React 类似,我们需要在...
-- custom footer / 自定义Footer --><templatev-slot:footerRender><global-footer/></template><router-view/></pro-layout></template>import{SettingDrawer,updateTheme}from'@ant-design-vue/pro-layout'import{i18nRender}from'@/locales'import{mapState}from'vuex'import{CONTENT_WIDTH_TYPE,SIDEBAR_TYPE,...
我们之前已经将我们的项目更改到能够在里面使用我们自己的接口了,但是我们进来以后的页面还是显得有些繁杂,毕竟这里面它自带的页面大多数我们都用不到。所以我们要去删除掉这些页面,便于我们后面再添加页面的时候不用那么的浪费时间,去找我们的页面。 这里面有我们文件
Ant Desgin pro of Vue从零开始(2) 我们之前已经成功地将项目添加到了我们的电脑上,现在直接将我们的项目拉到vscode中就可以了。 我们可以先将项目中所有的页面都看一下,这样可以更好的帮助我们明白那些是可以删除的,那些是我们直接保留就可以用的 我们要用这个框架那么我们首先要改掉的就是我们的登录,毕竟登录...
修改路径:ant-design-vue-pro/src/layouts/UserLayout.vue 修改位置:页脚内容定义在UserLayout中,具体修改位置如下图所示。修改页脚 到此自定义设置登录页面就设置完成了,修改之后的效果如下图所示。配置路由菜单 输入用户名和密码(都为admin)即可进入前端首页。脚手架首页如下图所示。本节我们暂时先介绍修改前端两...
笔者近期的项目开发都在使用Vue框架,在此整理下怎么样在Vue框架下实现ant-design-pro中菜单路由的配置方案。 背景: 一般中后台系统都需要根据当前登录用户的信息展示相应的模块,这就要求前端需要在拿到用户信息后对整个系统的菜单和路由做相应的鉴权处理。
vue.config.js文件是ant design pro的项目核心配置文件,每次修改配置后,都需要重启服务 在vue.config.js中进行配置 devServer: { // host: '0.0.0.0:8080', hot: true, disableHostCheck: true, // development server port 8000 port: 8000, // If you want to turn on the proxy, please remove the...
AntDesignPro是一个企业级中后台前端/设计解决方案,致力于提升[用户]和[设计者]的使用体验。 1 入门 1.1 安装 从GitHub仓库中直接安装最新的脚手架代码,生成完整的开发框架。 $ git clone --depth=1 https://github.com/sendya/ant-design-pro-vue.git my-project ...