[新增] checkbox 组件 待完成 menu 组件

This commit is contained in:
就眠仪式
2021-09-30 01:44:02 +08:00
parent 14908eea6a
commit e65a4e7588
15 changed files with 307 additions and 23 deletions

View File

@@ -0,0 +1,20 @@
::: demo
<template>
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
return {
}
}
}
</script>
<style>
</style>
:::

View File

@@ -23,6 +23,7 @@ export default {
width:100%;
height: 300px;
background: #79C48C;
border-radius: 4px;
}
</style>

View File

@@ -111,4 +111,60 @@ export default {
}
</script>
:::
::: demo
<template>
<lay-form>
<lay-checkbox v-model="checked" label="1">写作</lay-checkbox>
<lay-checkbox v-model="checked" label="2">画画</lay-checkbox>
<lay-checkbox v-model="checked" label="3">运动</lay-checkbox>
</lay-form>
{{checked}}
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
const checked = ref(['1','2']);
return {
checked
}
}
}
</script>
:::
::: demo
<template>
<lay-form>
<lay-checkbox skin="primary" v-model="checked" label="1">写作</lay-checkbox>
<lay-checkbox skin="primary" v-model="checked" label="2">画画</lay-checkbox>
<lay-checkbox skin="primary" v-model="checked" label="3">运动</lay-checkbox>
</lay-form>
{{checked}}
</template>
<script>
import { ref } from 'vue'
export default {
setup() {
const checked = ref(['1','2']);
return {
checked
}
}
}
</script>
:::

View File

@@ -4,7 +4,12 @@
<lay-menu>
<lay-menu-item title="首页"></lay-menu-item>
<lay-menu-item title="用户"></lay-menu-item>
<lay-menu-item title="角色"></lay-menu-item>
<lay-menu-item title="角色"></lay-menu-item>
<lay-menu-item title="目录" class="layui-nav-itemed">
<lay-menu-child-item title="菜单一"></lay-menu-child-item>
<lay-menu-child-item title="菜单二"></lay-menu-child-item>
<lay-menu-child-item title="菜单三"></lay-menu-child-item>
</lay-menu-item>
</lay-menu>
</template>

View File

@@ -1,5 +1,18 @@
##### 安装
npm 下载
```
npm install @layui/layui-vue --save
```
在 main.ts 中
```js
import App from './App.vue'
import { createApp } from 'vue'
import Layui from '@layui/layui-vue'
import '@layui/layui-vue/lib/layui.css'
createApp(App)
.use(Layui)
.mount('#app')
```