You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I'm using tampermonkey to write a script to beautify a page, and I need to add a button to the page, but the page will refresh(hydration) automatically after button is added. does vue have a hydration fully loaded event(finished event) for the page that I can listen to?
I've googled and search github issue/discussions, but found nothing help
'vue hydration finish event'
'tampermonkey wait vue hydration'
...
reproduce
// ==UserScript==// @name Style page// @description Style page// @match https://www.bilibili.com/video*// @author Cro-Marmot([email protected])// @version 0.0.1// @run-at document-idle// @grant GM_xmlhttpRequest// ==/UserScript==(function(){'use strict';constwaitForElm=(selector)=>{returnnewPromise(resolve=>{if(document.querySelector(selector)){returnresolve(document.querySelector(selector));}constobserver=newMutationObserver(mutations=>{if(document.querySelector(selector)){observer.disconnect();resolve(document.querySelector(selector));}});// If you get "parameter 1 is not of type 'Node'" error, see https://stackoverflow.com/a/77855838/492336observer.observe(document.body,{attributes: false,characterData: false,childList: true,subtree: true,attributeOldValue: false,characterDataOldValue: false,});});}constregOnUrlChange=(fn)=>{letoldHref=location.href;fn();// Track pages that don't really reload, but refresh the entire content (like youtube).constmutationObserver=newMutationObserver((mutations)=>{mutations.forEach(function(mutation){if(oldHref!=document.location.href){oldHref=document.location.href;fn();returntrue;}});});mutationObserver.observe(document.body,{attributes: false,characterData: false,childList: true,subtree: true,attributeOldValue: false,characterDataOldValue: false});};// ------------------ lib end ---------------------constcreateButton=async(parentElExp,button_id='style_button')=>{constp=awaitwaitForElm(parentElExp);if(document.getElementById(button_id)!==null){console.warn('Button Exist')return;}constbutton=document.createElement('button');button.id=button_id;button.innerText="change style";p.appendChild(button);};// ------------------ main start ---------------------regOnUrlChange(()=>createButton('.basic-desc-info'));})();
reacted with thumbs up emoji reacted with thumbs down emoji reacted with laugh emoji reacted with hooray emoji reacted with confused emoji reacted with heart emoji reacted with rocket emoji reacted with eyes emoji
-
I'm using tampermonkey to write a script to beautify a page, and I need to add a button to the page, but the page will
refresh(hydration)
automatically afterbutton
is added. does vue have a hydration fully loaded event(finished event) for the page that I can listen to?I've googled and search github issue/discussions, but found nothing help
reproduce
Beta Was this translation helpful? Give feedback.
All reactions