new Vue({
el: '#app',
data: () => ({
scrollY: 0,
}),
created() {
const onScroll = () => this.scrollY = window.scrollY;
window.addEventListener('scroll', onScroll);
},
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.6.14/vue.js"></script>
<div id="app">
<div class="scroll-y">scroll y: {{ scrollY }}</div>
<div v-for="i in 200">{{ i }}</div>
</div>
body {
margin: 0;
height: 100vh;
}
#app {
background: linear-gradient(to bottom, white, lime);
}
.scroll-y {
position: fixed;
background: black;
color: yellow;
right: 0;
margin: 10px;
padding: 10px;
font-size: 48px;
}
document.querySelector('input').addEventListener('keypress', function(e) {
e.preventDefault();
const
oldVal = this.value,
newVal = oldVal.replace(/(0)(?!.*\1)/, e.key);
this.value = newVal === oldVal ? `${e.key}${oldVal}` : newVal;
});
увы но нет
за 20 сек компонент апдейтнулся 8к раз и у меня упал браузер
document.body.style.filter = ...
.