Skip to main content
Create new
Introduction
Reactivity
Props
Logic
Events
Bindings
Lifecycle
Stores
Motion
Transitions
Animations
Easing
SVG
Actions
Classes
Component composition
Context API
Special elements
Module context
Debugging
7GUIs
Miscellaneous
App.svelte
<script>
let sp1 = 0;
let sp2 = 0;
let sp3 = 0;
$: spOthers = 100-sp1-sp2-sp3;
$:console.log('value sp1 outside before', sp1)
//variable to know wich percentager I am modifying
let current = 0
//functions to avoid circular dependencies error
function maxSp1(){
sp1 = 100-sp2-sp3
console.log('value of sp1 inside function: ', sp1)
spOthers=0
}
function maxSp2(){
sp2 = 100-sp1-sp3
spOthers=0
}
function maxSp3(){
sp3 = 100-sp2-sp1
spOthers=0
}
//Input validation
$: switch(current){
case 0:
sp1+sp2+sp3>100?maxSp1():null
break
case 1:
sp1+sp2+sp3>100?maxSp2():null
break
case 2:
sp1+sp2+sp3>100?maxSp3():null
loading Svelte compiler...
/* Select a component to see its compiled code */
result = svelte.compile(source, {
generate: ,
});
/* Select a component to see its compiled code */