D
D
dmitry20002021-07-27 21:47:59
Vue.js
dmitry2000, 2021-07-27 21:47:59

How to track a repeated click on an element?

I have n-number of elements, for example where I pass some data, string, object, array or other. In the method , I process the data and make logic based on it.<div @click="click(items)"></div>
click

click(items) {
let newNodes = Object.keys(this.nodes)
                .filter(el => items.includes(el))
                .reduce((obj, key) => {
                    obj[key] = this.nodes[key];
                    return obj;
                }, {});
for (let node in this.nodes) {
                this.nodes[node].style.opacity = 0.3;
            }

            for (let node in newNodes) {
                this.nodes[node].style.opacity = 1;
            }
}

this.nodesit's a set of svg elements on the page. As input, I get an array of some elements, which should be left with opacity: 1, and others should be made with opacity: 0.3. When I click on different elements , everything is OK, but if I click on the same one again, I need everything to return to its original places, i.e. opacity: 1 would be for all nodes. I do this using, if the input array is equal to the previous one, then make all elements opacity: 1. But, once again, if you click on the same button , then the logic breaks. I just haven't tried it. How to work with it competently? Maybe somehow you can add a state to each button <div @click="click(items)"></div><div @click="click(items)"></div>

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question