After abstraction, the problems encountered in
are roughly like this. Please take a look at how to solve them.
The data of the - page is rendered through
v-for
, and the id
attribute is index
.
- Click the button, and the server returns the style, which looks something like this:
{1: {height:"200px"}}
- modify the corresponding element style (Note: you cannot use DOM operation) according to the returned style.
- HTML code is as follows:
<ul>
<li v-for="(item, index) in items" :id="index">{{item}}</li>
</ul>
<button @click="change"></button>
</ul>
data: {
items: [1, 2, 3]
},
methods: {
change() {
//
setTimeout(() => {
// key1/2/3liid
let list = {
1: { height: "100px" },
2: { height: "200px" },
3: { height: "300px" }
}
}, 1000)
}
}
online editing points here