Element UI : 首页根据不同条件显示不同页面

来自CloudWiki
跳转至: 导航搜索

功能描述

根据IsLogin的值做出判断,

如果为真,显示内页,

如果为假,显示登录页。

代码

<template>
  <div id="app">
	  <template v-if="IsLogin == true">
			<el-container style="height: 700px; border: 1px solid #eee">

				<Aside></Aside>

				<el-container>
					<Header></Header>
					<!-- <Main></Main>	 -->
					<router-view></router-view>
					<el-footer></el-footer>
				</el-container>
			</el-container>
	  </template>
	  <template v-else>
		    <div>请登录</div>
	  </template>
		
  </div>
</template>

<script>
import HelloWorld from './components/HelloWorld.vue'
import Aside from './components/Aside.vue'
import Header from './components/Header.vue'
import Main from './components/Main.vue'
// const item = {
// 				date: '2016-05-02',
// 				name: '马小虎',
// 				address: '上海市普陀区金沙江路 1518 弄'
// 			};
export default {
  name: 'app',
  data() {
     return {
        IsLogin:false
  	}
  
  },
  components: {
    HelloWorld,
	Aside,
	Header,
	Main
  },
 //  data() {
 //     return {
	// 	tableData: Array(20).fill(item)
	// }
  
 //  }
}

		
</script>


<style>

</style>