navigation (component) how to manage internal state?

[onadeem1]

Could you guys list some examples for the components. Is it possible to pull in the component as is and then edit what you would like. For example if I wanted the NavigationNext component and I wanted to change what the function does. Lets say something like jump by two slides, how do you alter the functionality.

This what the docs say.
<NavigationNext />
Button allowing the user to navigate to the next view. Accepts an onClick function.

What does it mean accepts the onClick function and can I change the functionality.

If anyone could give a very short example that would be great. Thank you.

[onadeem1]

I am not exactly sure what the code should be and am confused by the "accepts onClick function" where should that go? Basically want to achieve something like this. This doesn't work but just to get the idea.

const NavigationNextCustom = ({ innerProps, currentIndex }) => {
    return (
      <div {...innerProps}>
        <button onClick={() => currentIndex = currentIndex + 2}>
          Jump by two
        </button>
      </div>
    )
  }

[onadeem1]

Sorry I think to be clearer I am asking since the carousel state is being maintained internally (correct me if that is wrong) how do we modify what clicking the previous or next button does?

[eyea]

2 points.
The first is that you can't change the value of the currentIndex directly. (as far as I can see)
And the solution I want to share to you：

// index.js
@inject(stores => ({
	current: stores.box.current,
        handleJumpTo: stores.box.handleJumpTo
}))

@observer
export default class PreviewImage extends React.Component {
const NavigationNextCustom = ({ ...props }) => {
    return (
      <div >
        <button onClick={() => this.props.handleJumpTo('next', 2)}>
            Jump by two
        </button>
      </div>
    )
  }
 render() {
  <Carousel
    ...props,  
    currentIndex={current}
  >
  </Carousel>
 }
}

// mobx.js
class box {
  @observable current = 0 // defalut value
  @action handleJumpTo(direction, steps) {
      if(direction==='next') {
         // of course, there are some controls before we jump :)
           self.current += steps
     }
  }
}