This repository has been archived on 2023-08-30. You can view files and clone it, but cannot push or open issues/pull-requests.
bytedo
/
wcui
Archived
1
0
Fork 0
Code Issues Pull Requests Wiki Activity

upadte

old
宇天 2021-02-23 19:35:14 +08:00
parent ee8c538708
commit 5f9bc4f95a
1 changed files with 9 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/form/input.wc
View File

@ -101,6 +101,7 @@ li {
.suggestion { .suggestion {
display: none; display: none;
overflow: hidden;
position: fixed; position: fixed;
z-index: 10240; z-index: 10240;
left: 0; left: 0;
@ -109,26 +110,14 @@ li {
height: auto; height: auto;
max-height: 200px; max-height: 200px;
min-height: 46px; min-height: 46px;
padding: 8px 0; padding: 4px 0;
border-radius: 2px; border-radius: 4px;
background: #fff; background: var(--color-plain-1);
box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); box-shadow: 0 2px 5px rgba(0, 0, 0, 0.15);
.list { .list {
width: 100%; width: 100%;
} }
&::after {
position: absolute;
left: 30px;
top: -4px;
width: 8px;
height: 8px;
background: #fff;
box-shadow: -1px -1px 2px rgba(0, 0, 0, 0.1);
transform: rotate(45deg);
content: '';
}
&.show { &.show {
display: flex; display: flex;
} }
@ -145,7 +134,7 @@ li {
&:hover, &:hover,
&[focus] { &[focus] {
background: var(--color-plain-1); background: var(--color-plain-2);
} }
} }
} }
@ -531,7 +520,7 @@ export default class Input {
// 渲染建议列表 // 渲染建议列表
this._parseSuggestion = $.bind(this.__INPUT__, 'click', ev => { this._parseSuggestion = $.bind(this.__INPUT__, 'click', ev => {
var { list } = this.props var { list } = this.props
let { x, y, width } = this.getBoundingClientRect() let { x, y, width, height } = this.getBoundingClientRect()
if (list && list.length) { if (list && list.length) {
var html = list var html = list
.map((it, i) => `<li data-idx="${i}">${it.value}</li>`) .map((it, i) => `<li data-idx="${i}">${it.value}</li>`)
@ -539,7 +528,8 @@ export default class Input {
this.__LIST__.firstElementChild.firstElementChild.innerHTML = html this.__LIST__.firstElementChild.firstElementChild.innerHTML = html
this.__LIST__.classList.toggle('show', true) this.__LIST__.classList.toggle('show', true)
this.__LIST__.style.cssText = `left:${x}px;top:${y + this.__LIST__.style.cssText = `left:${x}px;top:${y +
50}px;width:${width}px;` height +
5}px;width:${width}px;`
} else { } else {
this.__LIST__.classList.toggle('show', false) this.__LIST__.classList.toggle('show', false)
} }