Vue.js 如何使用F7+;内的v-for循环更新手风琴项目标题;Vue?

Vue.js 如何使用F7+;内的v-for循环更新手风琴项目标题;Vue?,vue.js,html-framework-7,v-for,Vue.js,Html Framework 7,V For,如何在F7+Vue中使用v-for循环更新手风琴项目标题?我需要将每个手风琴项目标题设置为使用v-for循环的myList数组中每个对象的标题 下面是一个例子: <f7-list-item v-for="value in myList" accordion-item title="{{value.Title}}"> <f7-accordion-content> <f7-block&g

如何在F7+Vue中使用v-for循环更新手风琴项目标题?我需要将每个手风琴项目标题设置为使用v-for循环的myList数组中每个对象的标题

下面是一个例子:

            <f7-list-item v-for="value in myList" accordion-item title="{{value.Title}}">
              <f7-accordion-content>
                <f7-block>
                  <p>{{value.foo}}</p>
                  <p>{{value.boo}}</p>
                </f7-block>
              </f7-accordion-content>
            </f7-list-item>

          </f7-list>


{{value.foo}}

{{value.boo}}


因为我需要花时间思考如何使用当前的F7+Vue手风琴和v-for来插入标题元素。。。这似乎是不可能的。我可能错了。我最终通过使用标准的非f7+vue组件解决了这个问题

例如:

          <div class="list accordion-list">
            <ul>
              <li class="accordion-item" v-for="value in myList">
                <a href="#" class="item-link">
                  <div class="item-content">
                    <div class="item-inner">
                      <div class="item-title">{{value.Title}}</div>
                    </div>
                  </div>
                </a>
                <div class="accordion-item-content">
                  <div class="block">
                      <p>{{value.foo}}</p>
                      <p>{{value.boo}}</p>
                  </div>
                </div>
              </li>
            </ul>
          </div>

  • {{value.foo}}

    {{value.boo}}