Rajesh
Rajesh

Reputation: 556

value is not assigned to variable in react native

Im new to react native. There are two files one is parent and another is child. From child file Im receiving callbacks in parent file.

In that callback , as attached in screenshot, I have value in this.positionId, but when I assign that to another variable is results as 'undefined'. Can anyone tell me why this is happening ?

Child js file contains panResponder :

componentWillMount: function() {
this._animatedValueX = 0;
this._animatedValueY = 0;
this.state.pan.x.addListener((value) => this._animatedValueX = value.value);
this.state.pan.y.addListener((value) => this._animatedValueY = value.value);
  this._panResponder = PanResponder.create({
    onMoveShouldSetResponderCapture: () => true, //Tell iOS that we are allowing the movement
    onMoveShouldSetPanResponderCapture: () => true, // Same here, tell iOS that we allow dragging
    onPanResponderGrant: (e, gestureState) => {
      this.state.pan.setOffset({x: this._animatedValueX, y: this._animatedValueY});
      this.state.pan.setValue({x: 0, y: 0}); //Initial value
    },
    onPanResponderMove: Animated.event([
      // null,
      // {
      //   dx: this.state.pan.x, dy: this.state.pan.y
      // }
    ]), // Creates a function to handle the movement and set offsets
    onPanResponderRelease: (e, gesture) => {
      this.state.pan.flattenOffset(); // Flatten the offset so it resets the default positioning
      this.props.releaseValues(e, gesture);
    }
  });
  },

as you can see the line this.props.releaseValues(e, gesture) gives the callback to parent controller.

Code of positionID component -->

addElements: function(){
return this.props.ElementsToBeAdded.map(function(element,key){
  return <DraggableView
      color={element}
      positionId={key}
      key={key}
      releaseValues={(e, gesture) => {
        if(((gesture.moveX > (currentX + currentWidht)) ||
            (gesture.moveX < currentX)) ||
            ((gesture.moveY > (currentY + currentHeight)) ||
            (gesture.moveY < currentY)))
        {
          _this.setState({positionID:this.positionId});
          _this.props.releaseValuesFirstView(e,gesture,0);
        }
        else {
          _this.props.releaseValuesFirstView(e,gesture,-1);
        }
      }
    } />
});
 },

enter image description here

Upvotes: 0

Views: 1704

Answers (1)

agenthunt
agenthunt

Reputation: 8678

The positionId is a prop to the DraggableView component. It is not available outside of the component. You can use key instead. Inside the DraggableView component, you can access it by this.props.positionId

Upvotes: 0

Related Questions