🐛(tooltip / select): 优化 select 自定义选项与 tooltip 边缘三角方向问题
This commit is contained in:
@@ -16,7 +16,7 @@
|
||||
<lay-select v-model="value">
|
||||
<lay-select-option :value="1" label="学习"></lay-select-option>
|
||||
<lay-select-option :value="2" label="编码"></lay-select-option>
|
||||
<lay-select-option :value="3" v-if="true">运动</lay-select-option>
|
||||
<lay-select-option :value="3" label="运动"></lay-select-option>
|
||||
</lay-select>
|
||||
</template>
|
||||
|
||||
@@ -47,7 +47,7 @@ export default {
|
||||
<lay-select-option :value="2" label="编码"></lay-select-option>
|
||||
<lay-select-option :value="3" label="运动"></lay-select-option>
|
||||
</lay-select>
|
||||
<lay-button @click="change2"> change :{{value2}}</lay-button>
|
||||
<lay-button @click="change2"> change :{{value2}} </lay-button>
|
||||
</lay-space>
|
||||
</template>
|
||||
|
||||
@@ -117,15 +117,15 @@ export default {
|
||||
|
||||
<template>
|
||||
<lay-space>
|
||||
<lay-select v-model="value3" :show-search="true" @search="search">
|
||||
<lay-select v-model="value3" :show-search="true">
|
||||
<lay-select-option value="1" label="学习"></lay-select-option>
|
||||
<lay-select-option value="2" label="编码"></lay-select-option>
|
||||
<lay-select-option value="3" :label="null"></lay-select-option>
|
||||
<lay-select-option value="3" label="运动"></lay-select-option>
|
||||
</lay-select>
|
||||
<lay-select v-model="value4" :show-search="true" :multiple="true" @search="search">
|
||||
<lay-select v-model="value4" :show-search="true" :multiple="true">
|
||||
<lay-select-option value="1" label="学习"></lay-select-option>
|
||||
<lay-select-option value="2" label="编码"></lay-select-option>
|
||||
<lay-select-option value="3" :label="null"></lay-select-option>
|
||||
<lay-select-option value="3" label="运动"></lay-select-option>
|
||||
</lay-select>
|
||||
</lay-space>
|
||||
</template>
|
||||
@@ -290,6 +290,35 @@ export default {
|
||||
</script>
|
||||
:::
|
||||
|
||||
::: title 定制选项
|
||||
:::
|
||||
|
||||
::: demo 使用 `lay-select` 标签, 创建下拉选择框
|
||||
|
||||
<template>
|
||||
<lay-select v-model="value">
|
||||
<lay-select-option :value="1" label="学习"></lay-select-option>
|
||||
<lay-select-option :value="2" label="编码"></lay-select-option>
|
||||
<lay-select-option :value="3" label="运动">运动</lay-select-option>
|
||||
</lay-select>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref } from 'vue'
|
||||
|
||||
export default {
|
||||
setup() {
|
||||
const value = ref(null);
|
||||
return {
|
||||
value
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
:::
|
||||
|
||||
|
||||
::: title Select 属性
|
||||
:::
|
||||
|
||||
|
||||
@@ -84,21 +84,21 @@ export default {
|
||||
<template>
|
||||
<div style="padding: 100px;max-width:400px;">
|
||||
<div style="text-align: center;">
|
||||
<lay-tooltip content="假装这里有文字提示">
|
||||
<lay-tooltip trigger="click" content="假装这里有文字提示">
|
||||
<lay-button>上边</lay-button>
|
||||
</lay-tooltip>
|
||||
</div>
|
||||
<div>
|
||||
<lay-tooltip content="假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示" position="left">
|
||||
<lay-tooltip trigger="click" content="假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示" position="left">
|
||||
<lay-button style="float:left;">左边</lay-button>
|
||||
</lay-tooltip>
|
||||
<lay-tooltip content="假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示" position="right">
|
||||
<lay-tooltip trigger="click" content="假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示" position="right">
|
||||
<lay-button style="float:right;">右边</lay-button>
|
||||
</lay-tooltip>
|
||||
<div style="clear: both;"></div>
|
||||
</div>
|
||||
<div style="text-align: center;">
|
||||
<lay-tooltip content="假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示" position="bottom">
|
||||
<lay-tooltip trigger="click" content="假装这里有文字提示假装这里有文字提示假装这里有文字提示假装这里有文字提示" position="bottom">
|
||||
<lay-button>下边</lay-button>
|
||||
</lay-tooltip>
|
||||
</div>
|
||||
|
||||
@@ -260,6 +260,8 @@ export default {
|
||||
| disabledPreview | 设置文件预览插槽区域为禁用状态 | boolean | false | -- |
|
||||
| cut | 是否开启选择图片后检测,设置true可开启 | boolean | false | -- |
|
||||
| cutOptions | 开启剪裁的模态弹窗与剪裁框的配置 | object | { layerOption,copperOption } | -- |
|
||||
| text | 普通上传描述 | string | -- | -- |
|
||||
| dragText | 拖拽上传描述 | string | -- | -- |
|
||||
|
||||
:::
|
||||
|
||||
|
||||
Reference in New Issue
Block a user