Question

I'm using jr.Call<float>("cameraExtrinsicPositionX") in my $(document).ready(function() { $('#fullpage').fullpage(); }); method of a React component. It works but I want to know how many rows it's rendering. I'm trying by initialising $( "#bigasshorizontaldiv" ).animate({ left: "-=thewidthofoneviewport", }, 5000, function() { // Animation complete. }); in my constructor, then incrementing it in the array.map callback:

render

But this is still showing zero. Full code here: jsfiddle.net/ra13jxak/. How can I show the number of rows returned?

Answer 1

You might consider filtering the members you want to display first, then displaying the length of the resulting array, and mapping over it to render the members:

Fiddle

- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    NSLog(@"fired via the button to the exit--- Segue: %@", [segue identifier]);
    if([[segue identifier] isEqualToString:@"YourSegueIdentifier"])
    {
         ((FinishViewController*)[segue destinationViewController]).delegate = self
    }
}

Edit: Thanks Edgar Henriquez, I fixed the key properties warning as you suggested

Answer 2

I think it's a good idea to extract it to the component:

JSFiddle Example

[Authorize]

I've added AzureAdBearer attribute to suppress a warning, you can read more about it on React Documentation.

Answer 3

您可以使用过滤器生成新数组，然后使用它来显示行数并迭代它。像这样：

const members = this.state.members.filter(member => member.display)
return (
  <div>
    <p>Number of rows = { members.length }</p>
    {members.map(member => <p>{ member.name }</p>)}
  </div>
)

Answer 4

只需使用：

{this.state.members.length}

Answer 5

只需在this.state.members上对某个条件使用过滤器，该条件是您案例中的显示属性

只需在元素周围包含div并获取实际渲染的元素，或者在应用具有特定条件的滤镜后使用length方法。

实现这样的渲染：

render(){
    return (
    <div>
       <p>Number of rows = {this.numRows}</p>
       <div id="members-with-display">
         {(this.state.members.filter((value)=>{return value.display})).map((member) => {
             return <p>{ member.name }</p>  
         })}
    </div>
    </div>
    );
}

您可以使用函数来了解渲染的行，如：

getRenderedRows(){
//Either you can use this
return document.getElementById("members-with-display").childElementCount;
 // Or this
return this.state.members.filter((value)=>{return value.display}).length;
}

Get size of array returned by map in React render

5 个答案: