Показать сообщение отдельно
  #10 (permalink)  
Старый 20.07.2022, 06:51
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

Aetae,
что-то не так ...
<!DOCTYPE html>
<html>

<head>
    <title>Untitled</title>
    <meta charset="utf-8">
    <style type="text/css">
        .item {
            border: 1px solid #008000;
            margin: 4px;
        }

        .active {
            border: 1px solid red;
        }
    </style>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vue/3.2.37/vue.runtime.global.min.js" ></script>
</head>

<body>
    <div id="app">
        <div v-for="{id} in itemsData"  :class="[{ active: itemsFlag[id] },'item']">
            <button @click="$set(itemsFlag, id, !itemsFlag[id])">Клик</button>
        </div>
    </div>
    <script>
        const app = new Vue({
            el: "#app",
            data: {
                itemsData: [{
                    id: "a"
                }, {
                    id: "b"
                }, {
                    id: "c"
                }],
               itemsFlag : {

               }
            }
        });
    </script>
</body>

</html>
Ответить с цитированием