Vant TreeSelect 分类选择

参考地址

父组件

<template>
  <div>
  <van-tree-select
  height="155vw"
  :items="items"
  :main-active-index.sync="active"
>
  <template slot="content">
    <test />
       
   
  </template>
</van-tree-select>

  </div>
</template>
<script>
import { Notify } from 'vant';
import test from './test'
export default {
  name: "index",
  components:{test},
  data() {
    return {
        active: 0,
      items: [{ text: '分组 1' }, { text: '分组 2' }]
    };
  },
 
};
</script>

子组件

<template>
   <div>
   <van-card
  num="2"
  price="2.00"
  desc="描述信息"
  title="商品标题"
  thumb="https://img.yzcdn.cn/vant/ipad.jpeg"
>
  <div slot="tags">
    <van-tag plain type="danger">标签</van-tag>
    <van-tag plain type="danger">标签</van-tag>
  </div>
  <div slot="footer">
    <van-button size="mini">按钮</van-button>
    <van-button size="mini">按钮</van-button>
  </div>
</van-card>
    </div>
</template>
<script>
    export default {
        name: "test",
        // props:{
        //     id:String,
        //     name:String
        // }
       
    }
</script>

猜你喜欢

转载自www.cnblogs.com/Alex-Mercer/p/12507847.html