From 64b432916af9c9218ab3f3eca614e26c542142ae Mon Sep 17 00:00:00 2001 From: jiangping <jp@doumee.com> Date: 星期二, 07 十一月 2023 15:47:13 +0800 Subject: [PATCH] bug --- minipro_standard/uni_modules/uview-ui/components/u-dropdown-item/u-dropdown-item.vue | 127 ++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 127 insertions(+), 0 deletions(-) diff --git a/minipro_standard/uni_modules/uview-ui/components/u-dropdown-item/u-dropdown-item.vue b/minipro_standard/uni_modules/uview-ui/components/u-dropdown-item/u-dropdown-item.vue index e69de29..f830291 100644 --- a/minipro_standard/uni_modules/uview-ui/components/u-dropdown-item/u-dropdown-item.vue +++ b/minipro_standard/uni_modules/uview-ui/components/u-dropdown-item/u-dropdown-item.vue @@ -0,0 +1,127 @@ +<template> + <view class="u-drawdown"> + <view + class="u-dropdown__menu" + :style="{ + height: $u.addUnit(height) + }" + ref="u-dropdown__menu" + > + <view + class="u-dropdown__menu__item" + v-for="(item, index) in menuList" + :key="index" + @tap.stop="clickHandler(item, index)" + > + <view class="u-dropdown__menu__item__content"> + <text + class="u-dropdown__menu__item__content__text" + :style="[index === current ? activeStyle : inactiveStyle]" + >{{item.title}}</text> + <view + class="u-dropdown__menu__item__content__arrow" + :class="[index === current && 'u-dropdown__menu__item__content__arrow--rotate']" + > + <u-icon + :name="menuIcon" + :size="$u.addUnit(menuIconSize)" + ></u-icon> + </view> + </view> + </view> + </view> + <view class="u-dropdown__content"> + <slot /> + </view> + </view> +</template> + +<script> +import props from './props.js'; +/** + * Dropdown + * @description + * @tutorial url + * @property {String} + * @event {Function} + * @example + */ +export default { + name: 'u-dropdown', + mixins: [uni.$u.mixin, props], + data() { + return { + // 锟剿碉拷锟斤拷锟斤拷 + menuList: [], + current: 0 + } + }, + computed: { + + }, + created() { + // 锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟�(u-dropdown-item)锟斤拷this锟斤拷锟斤拷锟斤拷锟斤拷data锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷微锟斤拷小锟斤拷锟斤拷锟斤拷锟斤拷循锟斤拷锟斤拷锟矫讹拷锟斤拷锟斤拷 + this.children = []; + }, + methods: { + clickHandler(item, index) { + this.children.map(child => { + if(child.title === item.title) { + // this.queryRect('u-dropdown__menu').then(size => { + child.$emit('click') + child.setContentAnimate(child.show ? 0 : 300) + child.show = !child.show + // }) + } else { + child.show = false + child.setContentAnimate(0) + } + }) + }, + // 锟斤拷取锟斤拷签锟侥尺达拷位锟斤拷 + queryRect(el) { + // #ifndef APP-NVUE + // $uGetRect为uView锟皆达拷锟侥节碉拷锟窖拷蚧锟斤拷锟斤拷锟斤拷锟斤拷锟侥碉拷锟斤拷锟杰o拷https://www.uviewui.com/js/getRect.html + // 锟斤拷锟斤拷诓锟揭伙拷锟斤拷锟絫his.$uGetRect锟斤拷锟斤拷锟斤拷锟轿猼his.$u.getRect锟斤拷锟斤拷锟竭癸拷锟斤拷一锟铰o拷锟斤拷锟狡诧拷同 + return new Promise(resolve => { + this.$uGetRect(`.${el}`).then(size => { + resolve(size) + }) + }) + // #endif + + // #ifdef APP-NVUE + // nvue锟铰o拷使锟斤拷dom模锟斤拷锟窖拷馗叨锟� + // 锟斤拷锟斤拷一锟斤拷promise锟斤拷锟矫碉拷锟矫此凤拷锟斤拷锟斤拷锟斤拷锟斤拷锟斤拷使锟斤拷then锟截碉拷 + return new Promise(resolve => { + dom.getComponentRect(this.$refs[el], res => { + resolve(res.size) + }) + }) + // #endif + }, + }, +} +</script> + +<style lang="scss"> +@import '../../libs/css/components.scss'; + +.u-dropdown { + + &__menu { + @include flex; + + &__item { + flex: 1; + @include flex; + justify-content: center; + + &__content { + @include flex; + align-items: center; + } + } + } +} +</style> -- Gitblit v1.9.3