update Menu

update Menu
This commit is contained in:
梁灏 2016-12-07 20:45:21 +08:00
parent 8778b3435d
commit e05d728978
10 changed files with 441 additions and 42 deletions

70
test/routers/menu.vue Normal file
View file

@ -0,0 +1,70 @@
<template>
<div>
<i-button @click="toggleMode">调整方向</i-button>
<Menu :mode="mode" active-key="1">
<Menu-item key="1">
<Icon type="ionic"></Icon>
<span>导航一</span>
</Menu-item>
<Menu-item key="2">导航二</Menu-item>
<Submenu key="3">
<span slot="title">导航三</span>
<Menu-group title="集合1">
<Menu-item key="3-1">导航三 - </Menu-item>
<Menu-item key="3-2">导航三 - </Menu-item>
</Menu-group>
<Menu-group title="集合2">
<Menu-item key="3-3">导航三 - </Menu-item>
<Menu-item key="3-4">导航三 - </Menu-item>
</Menu-group>
</Submenu>
<Menu-item key="4">导航四</Menu-item>
</Menu>
<br><br>
<!--<Menu mode="horizontal" theme="dark" active-key="1">-->
<!--<Menu-item key="1">-->
<!--<Icon type="ionic"></Icon>-->
<!--<span>导航一</span>-->
<!--</Menu-item>-->
<!--<Menu-item key="2">导航二</Menu-item>-->
<!--<Submenu key="3">-->
<!--<span slot="title">导航三</span>-->
<!--<Menu-item key="3-1">导航三 - </Menu-item>-->
<!--<Menu-item key="3-2">导航三 - </Menu-item>-->
<!--<Menu-item key="3-3">导航三 - </Menu-item>-->
<!--</Submenu>-->
<!--<Menu-item key="4">导航四</Menu-item>-->
<!--</Menu>-->
<!--<br><br>-->
<!--<Menu mode="horizontal" theme="primary" active-key="1">-->
<!--<Menu-item key="1">-->
<!--<Icon type="ionic"></Icon>-->
<!--<span>导航一</span>-->
<!--</Menu-item>-->
<!--<Menu-item key="2">导航二</Menu-item>-->
<!--<Submenu key="3">-->
<!--<span slot="title">导航三</span>-->
<!--<Menu-item key="3-1">导航三 - </Menu-item>-->
<!--<Menu-item key="3-2">导航三 - </Menu-item>-->
<!--<Menu-item key="3-3">导航三 - </Menu-item>-->
<!--</Submenu>-->
<!--<Menu-item key="4">导航四</Menu-item>-->
<!--</Menu>-->
</div>
</template>
<script>
export default {
props: {},
data () {
return {
mode: 'horizontal'
}
},
computed: {},
methods: {
toggleMode () {
this.mode = this.mode === 'horizontal' ? 'vertical' : 'horizontal';
}
}
}
</script>

View file

@ -1,16 +1,8 @@
<template>
<Row style="margin: 100px">
<i-col span="12" style="padding-right:10px">
<i-select :model.sync="model11" filterable>
<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>
</i-select>
</i-col>
<i-col span="12">
<i-select :model.sync="model12" filterable multiple>
<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>
</i-select>
</i-col>
</Row>
<i-button @click="model8 = ''">clear</i-button>
<i-select :model.sync="model8" clearable style="width:200px">
<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>
</i-select>
</template>
<script>
export default {
@ -42,8 +34,7 @@
label: '重庆市'
}
],
model11: '',
model12: []
model8: ''
}
}
}