|
@@ -1,6 +1,7 @@
|
|
|
-import { defineComponent } from 'vue'
|
|
|
+import { defineComponent, reactive } from 'vue'
|
|
|
import styles from './point.module.less'
|
|
|
import iconMulv from '../image/icon-mulv.svg'
|
|
|
+import { Collapse, CollapseItem } from 'vant'
|
|
|
export default defineComponent({
|
|
|
name: 'points',
|
|
|
props: {
|
|
@@ -14,7 +15,10 @@ export default defineComponent({
|
|
|
}
|
|
|
},
|
|
|
emits: ['handleSelect'],
|
|
|
- setup(props, {emit}) {
|
|
|
+ setup(props, { emit }) {
|
|
|
+ const pointData = reactive({
|
|
|
+ active: 1
|
|
|
+ })
|
|
|
return () => (
|
|
|
<div class={styles.container}>
|
|
|
<div>
|
|
@@ -34,7 +38,13 @@ export default defineComponent({
|
|
|
styles.item,
|
|
|
`${item.id}-${n.id}` === props.active ? styles.itemActive : ''
|
|
|
]}
|
|
|
- onClick={() => emit('handleSelect', {id: item.id, index, active: `${item.id}-${n.id}`})}
|
|
|
+ onClick={() =>
|
|
|
+ emit('handleSelect', {
|
|
|
+ id: item.id,
|
|
|
+ index,
|
|
|
+ active: `${item.id}-${n.id}`
|
|
|
+ })
|
|
|
+ }
|
|
|
>
|
|
|
{item.name}-{n.name}
|
|
|
</div>
|
|
@@ -44,6 +54,17 @@ export default defineComponent({
|
|
|
)
|
|
|
})}
|
|
|
</div>
|
|
|
+ <Collapse modelValue={pointData.active} accordion>
|
|
|
+ {[1, 2, 3].map((item: any) => {
|
|
|
+ return (
|
|
|
+ <CollapseItem title={'标题' + item} name={item}>
|
|
|
+ {[1, 2, 3, 4].map((n: any) => {
|
|
|
+ return <div>12</div>
|
|
|
+ })}
|
|
|
+ </CollapseItem>
|
|
|
+ )
|
|
|
+ })}
|
|
|
+ </Collapse>
|
|
|
</div>
|
|
|
</div>
|
|
|
)
|