You cannot select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.
< template >
< view class = "uni-collapse" >
< slot / >
< / view >
< / template >
< script >
/**
* Collapse 折叠面板
* @description 展示可以折叠 / 展开的内容区域
* @tutorial https://ext.dcloud.net.cn/plugin?id=23
* @property {Boolean} accordion = [true|false] 是否开启手风琴效果是否开启手风琴效果
* @event {Function} change 切换面板时触发， （ ） ：
*/
export default {
name : 'UniCollapse' ,
props : {
accordion : {
// 是否开启手风琴效果
type : [ Boolean , String ] ,
default : false
}
} ,
data ( ) {
return { }
} ,
provide ( ) {
return {
collapse : this
}
} ,
created ( ) {
this . childrens = [ ]
} ,
methods : {
onChange ( ) {
let activeItem = [ ]
this . childrens . forEach ( ( vm , index ) => {
if ( vm . isOpen ) {
activeItem . push ( vm . nameSync )
}
} )
this . $emit ( 'change' , activeItem )
}
}
}
< / script >
< style lang = "scss" scoped >
. uni - collapse {
/* #ifndef APP-NVUE */
width : 100 % ;
display : flex ;
/* #endif */
/* #ifdef APP-NVUE */
flex : 1 ;
/* #endif */
flex - direction : column ;
background - color : $uni - bg - color ;
}
< / style >