javascript - Vue2.0 How to get the index in the event without v-for loop?

Question

RT

In addition to using native, are there any methods and techniques that come with Vue?
Thank you~

Answer 1

var el = document.getElementById('container-id');

el.addEventListener('click', function(e) {    
    var p = e.target.parentElement;
    var index = Array.prototype.indexOf.call(p.children, e.target);
}

Just giving you an idea

---

<p class="container" ref="containBox">
    <span @click="getIndex">test</span>   
    <span>test</span>
    <span>test</span>
    <span>test</span>
    <span>test</span>
</p>

export default {
    methods: {
        getIndex (e) {
            const parent = this.$refs.containBox.xxx 
            // 上面我忘记xxx是什么了，反正可以获取父元素，console.log(this.$refs)看看
            const index = Array.prototype.indexOf.call(parent.children, e.target)
            // ...
        }
    }
}

Answer 2

Where does the index come from without a loop?? Where does the index refer to?

Answer 3

Use native document.queraySelectAlll to give li the same class name to get the li array. Now there is an index

Answer 4

I don’t quite understand what you mean. . . .
How to load list data without using v-for? To find the node sequence number according to the dom, you must also have the dom node. . .