12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061 |
- <template>
- <div class="main">
- <div class="comp-list">
- <div class="item" v-for="(item,index) in tagData" :key="index" >
- <el-tag @click="item.click">{{item.name}}</el-tag>
- </div>
- </div>
- <transition name="fade-transform" mode="out-in">
- <router-view />
- </transition>
- </div>
- </template>
- <script lang="ts">
- import { Component, Prop, Vue, Watch } from "vue-property-decorator";
- @Component
- export default class DemoIndex extends Vue {
- tagData:Array<any> = [{
- name:'表单',
- click:()=>{
- (this as any).$router.push('/demo/form')
- }
- },{
- name:'表格',
- click:()=>{
- (this as any).$router.push('/demo/table')
- }
- },{
- name:'moduleView',
- click:()=>{
- (this as any).$router.push('/demo/moduleView')
- }
- },{
- name:'单据',
- click:()=>{
- (this as any).$router.push('/demo/bill')
- }
- },{
- name:'弹窗',
- click:()=>{
- (this as any).$router.push('/demo/dialog')
- }
- }]
- }
- </script>
- <style scoped lang="scss">
- .main{
- height: 100%;
- width: 100%;
- overflow: auto;
- .comp-list{
- display: flex;
- flex-wrap: wrap;
- .item{
- margin-bottom: 16px;
- cursor: pointer;
- }
- }
- }
- </style>
|