Make drop-down list in react

First we set the default state in the constructor

this.state = { 
  myValue: "default"
}

Then we build the option-elements

let options = ["value1", "value2", "value3"];
for (let i = 0; i < valg.length; i++) {
   options[i] = <option key={options[i]} value={options[i]}>{options[i}</option>);
}

Finally we insert the select-box

<p>MyValue: <select value={this.state.myValue} onChange={(e) => this.setState({myValue: e.target.value})}>{options}</select></p>
Published
Categorized as code, react

Some react sorting-functions

function sorterTallFallende(liste,par) {
	liste.sort(function(a,b) {
		let valA = parseFloat(a);
		let valB = parseFloat(b);
		if(!a[par] || isNaN(parseFloat(a[par]))) return 1;
		if(!b[par] || isNaN(parseFloat(b[par]))) return -1;
		return b[par] - a[par];
	});
}

function sorterTallStigende(liste,par) {
	liste.sort(function(a,b) {
		let valA = parseFloat(a);
		let valB = parseFloat(b);
		if(!a[par] || isNaN(parseFloat(a[par]))) return 1;
		if(!b[par] || isNaN(parseFloat(b[par]))) return -1;
		return a[par] - b[par];
	});
}

	
function sorterTekstAlfabetisk(liste,par) {
	liste.sort(function(a,b) {
		if(!a[par]) return 1;
		if(!b[par]) return -1;
		return a[par] > b[par] ? 1 : -1;
	});
}
	
function sorterTekstMotsattAlfabetisk(liste,par) {
	liste.sort(function(a,b) {
		if(!a[par]) return 1;
		if(!b[par]) return -1;
		return a[par] < b[par] ? 1 : -1;
	});
}
	
function sorterHøyMiddelsLav(liste,par) {
	liste.sort(function(a,b) {
		let valA = 0;
		let valB = 0;
		if(a[par] == "Lav") {
			valA = 1;
		} else if (a[par] == "Middels") {
			valA = 2;
		} else if (a[par] == "Høy") {
			valA = 3;
		}
		if(b[par] == "Lav") {
			valB = 1;
		} else if (b[par] == "Middels") {
			valB = 2;
		} else if (b[par] == "Høy") {
			valB = 3;
		}
		return valB - valA;
	});
}

function sorterGodMiddelsDårlig(liste,par) {
	liste.sort(function(a,b) {
		let valA = 0;
		let valB = 0;
		if(a[par] == "Dårlig") {
			valA = 1;
		} else if (a[par] == "Middels") {
			valA = 2;
		} else if (a[par] == "God") {
			valA = 3;
		}
		if(b[par] == "Dårlig") {
			valB = 1;
		} else if (b[par] == "Middels") {
			valB = 2;
		} else if (b[par] == "God") {
			valB = 3;
		}
		return valB - valA;
	});
}
	

function sorterArraystørrelse(liste,par) {
	liste.sort(function(a,b) {
		return a[par].length < b[par].length ? 1 : -1;
	});
}

Published
Categorized as code, react