While using haxe-react it renders String instead of Component?

42 views
Skip to first unread message

Saumya

unread,
Apr 9, 2017, 2:50:39 AM4/9/17
to Haxe
hi all,
I am trying to render a list component using HAXE and haxe-react. But it renders the '' as string in HTML! Any directions. Here is the code for it.



The thing is it compiles fine. But renders the 'div' as the string in HTML as '<div>content</div>' .

Here is the code sample.

  override public function render(){
    var sList:String = this.getListString();

    return jsx('
      <div style={{margin:"10px", border:"black 2px solid"}}>
      ${/* sList */}
      </div>
    ');
  }
  private function getListString():String{
    var result:String = '';
    for (i in 0 ... 10) {
      result += ('<div>'+i+'</div>');
    }
    return ('<div style={{margin:"10px", border:"black 2px solid"}}>'+result+'</div>');
  }

thanks

Saumya

unread,
Apr 9, 2017, 4:10:13 AM4/9/17
to Haxe
Sorry for early panic. I fixed it with this.

  override public function render(){
    var aList = this.getListArray();
    return jsx('
      <div style={{margin:"10px", border:"black 2px solid"}}>
          <h3>ViewList</h3>
          ${/* aList */}
      </div>
    ');
  }
  private function getListArray(){
    var aResult = [];
    for (i in 0 ... 10) {
      aResult.push( jsx('<div style={{margin:"10px", border:"#6666FF 1px solid"}}>${/* i */}</div>') );
    }
    return aResult;
  }

thanks
saumya

Philippe Elsass

unread,
Apr 9, 2017, 9:36:08 AM4/9/17
to Haxe
Cheers, yes you must use the jsx macro. And don't forget the 'key' attribute when rendering a list of items.

Philippe 

--
To post to this group haxe...@googlegroups.com
http://groups.google.com/group/haxelang?hl=en
---
You received this message because you are subscribed to the Google Groups "Haxe" group.
For more options, visit https://groups.google.com/d/optout.
Reply all
Reply to author
Forward
0 new messages