vue 移动端渲染菜单 及 顶部header的问题

Question

求助一下，在做移动端的顶部header 和 底部的tab时 ，我打算是通过权限匹配路由，把有权限的顶部tab渲染出来，不知道这样的思路是否可取？ 然后如果采取这样的方式的话，我应该是通过 created 去处理 ，还是通过 mounted还是需要在其他流程节点上做处理呢？
还有顶部的header，要怎么判断它是否显示右侧的搜索、左侧的返回等等这些按钮呢？目前这里有点卡主

Answer 1

可以在进入页面的时候就让用户登录(或根据本地信息判断是否已登陆)，然后根据登录后返回的用户信息，配置你的一些权限，或者就直接由后台把这些信息返回给你,然后把这些信息保存下来，供后面的功能使用。如：{    username:'test',    userid:1,    route:[{        path:'xx/x',        hassearch:true,        hasback:false    }]}

Answer 2

header定义组件 传值就行sunComponents.vue<template>&nbsp; <div id='default'>&nbsp; &nbsp; <div>&nbsp; &nbsp; &nbsp; <p>logo</p>&nbsp; &nbsp; &nbsp; <p v-if="show">搜索</p>&nbsp; &nbsp; </div>&nbsp; </div></template><script>export default {&nbsp; prop: {&nbsp; &nbsp; show: {&nbsp; &nbsp; &nbsp; type: Boolean,&nbsp; &nbsp; &nbsp; default: true&nbsp; &nbsp; }&nbsp; },&nbsp; data() {&nbsp; &nbsp; return {};&nbsp; },&nbsp; created() {},&nbsp; methods: {}};</script><style></style>father.vue<template>&nbsp; &nbsp; <div>&nbsp; &nbsp; &nbsp; &nbsp; <sub :show='show'></sub>&nbsp; &nbsp; </div></template><script>import sub from "./sunComponents";export default {&nbsp; data() {&nbsp; &nbsp; return {&nbsp; &nbsp; &nbsp; show:false&nbsp; &nbsp; };&nbsp; },&nbsp; created() {},&nbsp; methods: {}};</script><style></style>

Answer 3

涉及到用户身份，适用全局存储，建议用 Vuex，过程大概是这样的：启动时请求接口获取用户身份和权限信息，并保存在全局变量里组件将这些信息整合进&nbsp;computed&nbsp;渲染至于后退键，应该根据路由来判断了，比如详情页返回列表页，列表页返回首页等。