I pass 2 values to a child component:

1. List of objects to display


2. delete function.

I use a .map() function to display my list of objects(like in the example given in react tutorial page), but the button in that component fires the onClick function, on render(it should not fire on render time). My code looks like this:

module.exports = React.createClass({

    render: function(){

        var taskNodes = this.props.todoTasks.map(function(todo){

            return (

                <div>

                    {todo.task}

                    <button type=submit onClick={this.props.removeTaskFunction(todo)}>Submit</button>

                </div>

            );

        }, this);

        return (

            <div className=todo-task-list>

                {taskNodes}

            </div>

        );

    }

});

My question is: why does onClick function fire on render and how to make it not to?