小编Nit*_*y J的帖子

ReactJS中的子父组件通信

我喜欢在事件触发时将属性属性/ props/state值从子组件发送到父组件onDrag.我找不到合适的文件.

这是我的代码:

/*** @jsx React.DOM */
var APP=React.createClass({
  getInitialState:function()
  {
     return {url:'http://www.youtube.com/embed/XGSy3_Czz8k'}
  },
  handleDrag:function(vidurl)
  {
    alert(vidurl);    //i need to get child component url here.
  },
  render:function(){
    return  <div>
               <VideoFrame  src={this.state.url} />
               <hr/>
           <videos handle={this.handleDrag(vidurl)} />
        </div>
  }
});

var VideoFrame=React.createClass({
  render:function(){
    return  <div>
          <iframe width="420" height="315"  src={this.props.src}>
          </iframe>     
        </div>
  }
});

var videos=React.createClass({
  getInitialState:function()
  {
    return {vidurl:'http://www.youtube.com/embed/XGSy3_Czz8k'}
  },
  render:function()
  {
    return  <img src="http://upload.wikimedia.org/wikipedia/en/a/a6/Size_Small.PNG" onDrag={this.props.handle.bind(this.state.vidurl)}></img> //trying to send state value from here
  }
});

React.renderComponent(<APP />, document.body);      
Run Code Online (Sandbox Code Playgroud)

我希望我的代码清楚.

javascript reactjs react-jsx reactjs-native

7
推荐指数
1
解决办法
7183
查看次数

动态创建ng-templates以使用angular-ui-bootstrap显示弹出窗口内容

如果我将模板ID硬编码为id ="popover00.html",则popover有效但是当从ng-repeat生成相同的id时它不起作用.它正在服务器上查找文件.

Popover作品:

 <div  ng-repeat="(keyT, T) in Tdata track by $index"> 

   <div ng-repeat="(keyS,S) in Sdata track by $index" popover-trigger="mouseenter" uib-popover-template={{"'popover"+keyT+keyS+".html'"}} >
    <script type="text/ng-template" id="popover00.html">
      <div>
        This is an HTML <b>template</b><br>

      </div>
    </script>
   </div> 
 </div>
Run Code Online (Sandbox Code Playgroud)

弹出不工作:

 <div  ng-repeat="(keyT, T) in Tdata track by $index"> 

   <div ng-repeat="(keyS,S) in Sdata track by $index" popover-trigger="mouseenter" uib-popover-template={{"'popover"+keyT+keyS+".html'"}} >
    <script type="text/ng-template" id={{"popover"+keyT+keyS+".html"}}>
      <div>
        This is an HTML <b>template</b><br>

      </div>
    </script>
   </div> 
 </div>
Run Code Online (Sandbox Code Playgroud)

javascript angularjs angular-ui angularjs-ng-repeat

2
推荐指数
1
解决办法
2370
查看次数