vant的Collapse 折叠面板和单元格中使用v-for

import Vue from 'vue';

import { Cell, CellGroup,Collapse ,CollapseItem} from 'vant';

        

         

            :key="index"

            :title="item.title"

            :value="item.grade"

            v-for="(item, index) in items"

          />

     

在使用v-for时,必须配合使用v-bind

   export default {

       //组件 Q2组件需要正确注册,才能被页面识别

      components: {

           [Cell.name]: Cell,

           [CellGroup.name]: CellGroup,

           [Collapse .name]: Collapse ,

          [CollapseItem.name]: CollapseItem

      },

     //数据层

     data() {

        return {

             activeNames: [],

             items: [

                  { title: "李红", grade: "高一语文组" },

                  { title: "李名", grade: "高一数学组" },

                  { title: "李光", grade: "高一英语组" },

                  { title: "李严", grade: "高二英语组" },

                  { title: "李章", grade: "高二数学组" }

           ]

        },

        mounted() {},

        methods: {}

     }

};

vant的Collapse 折叠面板和单元格中使用v-for_第1张图片

你可能感兴趣的:(前端,vue)