v-for loop cannot get data using queryselectorall
-
{{item.title}}
{{item.datanum}}张
created () { this.getData(); }, methods: { getData () { let _this = this; this.loading = true; this.$http.get('web/app/query.do', { params: { 'key': '88845608c16c76ef9f4a56b12e3f238be', 'pageSize': '10', 'a_no': '001', 'classify': '01' } }).then((res) => { _this.items = res.body.result; _this.waterfull(); console.log(_this.items); }, (err) => { console.log(err); }); }, waterfull () { var items = document.querySelector('.content'); var boxes = items.querySelectorAll('li'); console.log(items); // var totalWidth = items.style.width; console.log(boxes); }
Understand the life cycle of the instance. In the created stage, the dom has not been rendered yet
The person above is right, you can write like this when rendering
This should work. If not, try filling in a time in setTimeout, milliseconds will do
It’s indeed a life cycle issue, but what I’m more confused about is, since vue is used, why do we need to retrieve it through Dom?
You can use ref to directly bind dom elements, and then use $refs to operate.