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