改变对象属性$set,和原始写法引用场景：点击展开，再次点击关闭，或者点击选中，再次点击取消选中

た入场券 2023-05-21 08:56 27阅读 0赞

<template>
      <div class="hello">
        <h1>{
       { msg }}</h1>
        <h2 @click="$router.push('/second')">Ecosystem</h2>
       <p v-for="e in arr" :key="e.index"><span :class="{aaaa:e.show}"  @click="changeset(e)">{
       {e.name}}{
       {e.age}}</span><span v-if="e.show">sss</span></p>
       
      </div>
    </template>
    
    <script>
    export default {
      name: "HelloWorld",
      created(){
          this.arr.forEach(element => {
          this.$set(element, 'show', false)//方法一
          // element.show=false     //方法二
      }) 
      },
      data() {
        return {
          msg: "Welcome to Your Vue.js App",
          arr:[{name:'色子',},{ name:'111',},{ name:'ouya',},{ name:'欧阳',},{ name:'乐总',},{ name:'邱总',},{ name:'牛逼',}]
        };
      },
      methods:{
          changeset(e){
            this.$set(e,'show',!e.show)//方法一
            // e.show=!e.show            //方法二
            // let a =[]
            // this.arr.forEach(e=>{
            //   a.push(e)
            // })
            // this.arr = a
          }
      }
    };
    </script>
    
    
    <style scoped>
    .aaaa{
      border: 1px solid red;
    }
    
    </style>

发表评论取消回复

表情：

评论列表（有 0 条评论，27人围观）

还没有评论，来说两句吧...

相关阅读

相关 Android点击View显示PopupWindow，再次重复点击View关闭PopupWindow

Android点击View显示PopupWindow，再次重复点击View关闭PopupWindow 这本身是一个看似很简单的问题，但是如果设置不当，就可能导致莫名其

r囧r小猫/ 2023年10月17日 08:49/ 0 赞/ 140 阅读

相关改变对象属性$set,和原始写法引用场景：点击展开，再次点击关闭，或者点击选中，再次点击取消选中

<template> <div class="hello"> <h1>{ { msg }}</h1> <h2

た入场券/ 2023年05月21日 08:56/ 0 赞/ 28 阅读

相关 vue 非必填项单选点击一下选中再次点击取消

<el-form-item label="标段异常状态" prop="biddingState"> <el-radio-group v-mode

偏执的太偏执、/ 2022年10月11日 00:54/ 0 赞/ 266 阅读

相关点击显示再次点击隐藏

<script> $(function()\{ $('\a').click(function()\{//点击a标签 if($('

亦凉/ 2022年06月07日 09:06/ 0 赞/ 375 阅读

相关 js radio点击选中再点击取消

$(function(){ $('input:radio').click(function(){

柔光的暖阳◎/ 2022年06月01日 10:25/ 0 赞/ 416 阅读

相关 MUI点击图片放大，再次点击关闭

css部分可自己创建.css文件，然后引入到html页面中使用。 .mui-preview-image.mui-fullscreen { position

秒速五厘米/ 2022年02月04日 01:39/ 0 赞/ 615 阅读

相关 jQuery实现radio第一次点击选中第二次点击取消

项目开发需要，直接贴代码在JavaScript中，即可实现对于页面所有的radio实现： // jquery $('input:radio').click

绝地灬酷狼/ 2021年12月23日 16:39/ 0 赞/ 367 阅读

相关 jquery checkbox点击选中，再点击取消选中

if(n==1){ if($("abs1").is(':checked')){ $("abs1"

刺骨的言语ヽ痛彻心扉/ 2021年12月04日 06:39/ 0 赞/ 462 阅读

相关 mysql 实现点击后+1 再次点击后-1

> 运用环境：点击收藏商品状态改为 1 ；再次点击取消收藏状态改为 0。 update table set num=num^1 ; > 这条语句你会发现当你更

阳光穿透心脏的1/2处/ 2021年09月24日 00:04/ 1 赞/ 460 阅读

相关选项卡点击多选，再次点击取消选中，选项卡变色（uni)

效果 ![在这里插入图片描述][20201218101530667.png_pic_center] js部分 redio_cli(e,ind){

一时失言乱红尘/ 2021年07月24日 16:03/ 0 赞/ 789 阅读