javascript - react.js dynamically grabbing object resulting in undefined -


i learning react.js. have object literal , trying dynamically select object within object based upon chosen select input. getting undefined, however. have tried both dot , bracket notation. grabbing value of selected option , storing within variable. ideas?

here object: 

var horolist = { aries: {     title: "jerkface", }, cancer: {     title: "cancerous", }, gemini : {     title: "goofball" } } ;

here of jsx within render method:

                    <select name="pick-sign" onchange={this.handlechange}>                         <option></option>                         <option value="aries" >aries</option>                         <option value="cancer" >cancer</option>                         <option value="gemini" >gemini</option>                         <option value="taurus" >taurus</option>                     </select>

and here handle change method:

        handlechange: function(e) {         var selectedhoro = e.target.value;         console.log(selectedhoro); //outputs: aries         console.log(horolist); //outputs: object {aries: object, cancer: object, gemini: object}         console.log(horolist.aries); //ouputs: object {title: "jerkface"}         console.log(horolist['selectedhoro']); //outputs: undefined         // this.setstate({         //  horos: horolist.selectedhoro         // });     },

if change line:

console.log(horolist['selectedhoro']); //outputs: undefined

to:

console.log(horolist[selectedhoro]);

you should expected output. when use horolist['selectedhoro'], literal string value selectedhoro used horolist.selectedhoro. when use horolist[selectedhoro], selectedhoro variable , it's value used determine property name want resolve resolve horolist.aeries (when selectedhoro === aeries).


Comments

Post a Comment

Popular posts from this blog

javascript - Google App Script ContentService downloadAsFile not working -

i have web app developed using google app script htmlservice , html form, populating excel sheet in google drive using spreadsheetapp . , 1 section calling contentservice download data excel file. function doget(e) { // read excel sheet //getappfile(); // render application html template return htmlservice.createtemplatefromfile('index').evaluate() .settitle('go smart') .setsandboxmode(htmlservice.sandboxmode.iframe); } function downloaddoublequatecsvfile() { var sheetid = propertiesservice.getscriptproperties().getproperty('sheetid'); var ss = spreadsheetapp.openbyid(sheetid).getactivesheet(); //var ss = spreadsheetapp.getactivespreadsheet().getactivesheet(); var maxcolumn = ss.getlastcolumn(); var maxrow = ss.getlastrow(); var data = ss.getrange(1, 1, maxrow, maxcolumn).getvalues(); if (data.length > 1) { var csv = ""; (var row = 0; row < data.length; row++) { (var c...
Read more

javascript - Function overwritting -

is there way overwrite function or event handling in function? using addeventlistener, can have many event handlers on element want var test=document.getelementbyid("div"); test.addeventlistener("click",function(){alert("im first");},false); test.addeventlistener("click",function(){alert("im second");},false); // alerts "im first" , after "im second" but if want overwrite function/event example based on client width example this function one() { alert("first"); } function two() { alert("second"); } window.onresize = function() { var test = document.getelementbyid("div"); if (window.innerwidth > 500) { test.onclick = 1 } else { test.onclick = two; } } is possible in javascript? in case use effective little known approach. addeventlistener can accept object property handleevent event handler. in case it's easy overwr...
Read more

c# - Exception when attempting to modify Dictionary -

i creating dictionary manage threads , ran exception when attempt clear dead threads after adding threads dictionary. using system; using system.collections.generic; using system.threading; namespace syscat { public class threadmanager { public static readonly threadmanager globalthreadmanager = new threadmanager( ); /// <summary> /// initializes new instance of <see cref="syscat.threadmanager"/> class. /// </summary> public threadmanager( ) { } /// <summary> /// create new threadmanager threads within basetm , deinitializes basetm /// </summary> public threadmanager( threadmanager basetm ) { this.threads = basetm.threads; basetm.threads.clear( ); } private dictionary<guid,thread> threads = new dictionary<guid, thread>( ); /// <summary> /// attempts obtain unused threadid within ...
Read more