¿Cómo garantizar que js se ejecute después de representar los elementos de la página?

Vue.js debe usarse junto con los métodos watch y nextTick. El método específico es el siguiente.

Pasos específicos:

1. Después de cargar la lista de datos en la página, la página se desplazará automáticamente al elemento de la lista del medio. Debe calcular la altura de la lista después de representar los datos de la lista y luego controlar el posicionamiento en la fila especificada. Primero, presentaremos la solución que no surte efecto al comienzo del siguiente intento, que también es la más propensa a errores. La función montada proporcionada por vue.js se refiere a llamar al gancho después del montaje en la instancia.

2. Después de ejecutar, se encontró que el valor de altura obtenido cuando se ejecutó el montaje era incorrecto. También puedes encontrarlo rompiendo un punto de interrupción. En este punto, la página no se representa y el bloque de lista todavía está en blanco.

3. En este momento, verifiqué la documentación oficial de la API y descubrí que existe un método nextTick, que significa ejecutar una devolución de llamada retrasada después del final del siguiente ciclo de actualización de DOM. Utilice este método inmediatamente después de modificar los datos para obtener el DOM actualizado. Después de usarlo, descubrí que todavía no podía obtener el efecto que necesitaba.

4. Continúe consultando la documentación de la API y busque el método de observación, que se utiliza para observar los cambios de datos en la instancia de Vue. Correspondiente a un objeto, la clave es la expresión de observación y el valor es la devolución de llamada correspondiente. Inténtalo de nuevo, todavía no funciona después de ejecutarlo.

5. Finalmente, combina watch y nextTick.

watch:{ showList:function(){ this . goprice(0);}}

ShowList corresponde a la variable de enlace de la página de la tabla.

& lttr v-for="(item, index) in showList "

6. Después de ejecutarlo, se descubrió que se logró el efecto esperado.

7. Finalmente, a veces pensamos en usar setTimeout, que requiere establecer un tiempo de ejecución de tiempo de espera. Debido a que no se puede determinar el tiempo de renderizado, será inestable ya sea rápido o lento.