使自动生成的下拉按钮在vue.js中单独工作

时间:2019-02-09 10:51:17

标签: vue.js

我创建了一个下拉按钮,当单击一个下拉按钮时,所有按钮都会更改状态,该按钮会随着数据自动递增。我希望唯一单击的按钮可以更改语句。这是模板的来源

          <v-flex v-for="Law in laws" :key="Law.txt">
          <v-card width="800px">
              <v-card-title primary-title>{{ Law.chapter}}
                  <v-card-action>
                    <v-btn icon @click="show = !show">
                        <v-icon>{{ show ? 'keyboard_arrow_down' : 'keyboard_arrow_up' }}</v-icon>
                    </v-btn>
                  </v-card-action>
              </v-card-title>
              <v-slide-y-transition>
                  <v-card-text v-show="show" v-html="Law.ltxt">}</v-card-text>
              </v-slide-y-transition>
          </v-card>
      </v-flex>

和脚本

data: () => ({
dark: true,
show: false,
drawer: null,
items: [
  { icon: 'home', text: 'Home' },
  { icon: 'bookmark', text: 'Bookmarks' },
  { icon: 'info', text: 'About' }
],
laws: [
  {chapter: 'Chapter 1', ltxt: '<b>Purpose.</b><br>The purpose  of this  Act is to ensure that the  system  of administration of criminal justice  in Nigeria promotes  efficient management of criminal  justice institutions, speedy  dispensation  of justice, protection  of the society  from crime and  protection of the rights and interests of the suspect,  the defendant,  and the victim.'},
  {chapter: 'dam', ltxt: 'dadhgsdcsadhgsavvhdgavsgdvsadjsandajbsbd'},
  {chapter: 'dam', ltxt: 'dadhgsdcsadhgsavvhdgavsgdvsadjsandajbsbd'},
  {chapter: 'dam', ltxt: 'dadhgsdcsadhgsavvhdgavsgdvsadjsandajbsbd'}
]

}),   道具: {     资料来源:字串   }

0 个答案:

没有答案