Iview carousel picture value got, but after entering does not display the picture need to press F12 to appear the picture?

problem description

add a racing lantern to the modal box. After opening the modal box, the content is white. In fact, you have already got the SRC of the picture

the environmental background of the problems and what methods you have tried

related codes

/ / Please paste the code text below (do not replace the code with pictures)

< Carousel autoplay VMI model = "value2" VMI if = "loop >" loop >

<Carousel-Item v-for="(item,index) in uploadList" :key="index">
  <div class="demo-carousel">
   <img :src="item" style="height:241px;width:444px;" alt=""/>
   </div>
</Carousel-Item>

< / Carousel >

what result do you expect? What is the error message actually seen?

you can see the picture rotation as soon as you enter it

Vue.js javascript iview

Dec.13,2021

inspired by @ panda wine fairy, there is a simple way to solve the problem. Add a v-if instruction to carousel, and the value is bound to the booean value of your control modal. In this way, carousel will delay initialization and achieve the effect of calculating listwidth so that it does not let it fall short of 0

I also encountered this problem, which is caused by a width of 0. As you can see from the source code, the width has been calculated when the page initializes (mounted), this.handleResize (); I extracted this component, and then changed its source code to execute handleResize before calling updatePos. Here are two pictures to understand

you can display the height and width of the picture and related elements or hide the display properties when displaying the page. Compare the display with that after pressing f12
, and then analyze

and F12 are sure it has nothing to do with the slow loading time? Or is the initial value empty for operation assignment?

Building owner, has the problem been solved? I have the same problem.

Previous: How does the vue axios interceptor add a timestamp to each request?

Next: Token prevents forms from repeatedly submitting questions

Can the percentage of table height be set in iview?
as shown in the figure, I need to set height, according to the window size according to the percentage, but I find that the unit given to% percentage is useless and will automatically become px,. For example, when I set 80%, the page parses to 80px . ...

Vue.js javascript iview

Mar.04,2021
How v-model binds variables
RT v-model binds the variable item.key , within the loop and the actual result is that the value is displayed as a string binding. Awkward are there any other methods that support two-way binding? columns looks something like this [ { title:...

Vue.js javascript iview

Mar.13,2021
Unlock the iview spin component can not stop on the android handheld device.
I have used the spin element in iview to turn circles normally during chrome debug , but spin will only stop in person when I import APP into Android. what is missing in my code? Or is it a problem of its own? <template> <div> <s...

Spinner android vue.js javascript iview

Apr.02,2021

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1b37424-2c076.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1b37424-2c076.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?