Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
In this article, we are going to see how to create a reference to any DOM element in the functional component.This method is used to access any DOM element in a component and it returns a mutable ref object which will be persisted as long as the component is placed in the DOM. If we pass a ref object to any DOM element, then the. current property to the corresponding DOM node elements will be added whenever the node changes.SyntaxReact.createRef()ExampleIn this example, we will build a React application that will pass the ref object to two input fields and when ... Read More
ExamplesApproach to solve this problemStep 1 − Define a method that accepts head of the linked list.Step 2 − If head == nil, return the head.Step 3 − When index == 0, then return head.nextStep 4 − Else, Iterate given linked list from head.Step 5 − If index i matches with given index(to be delete) then delete that node.next, break the loop.Step 6 − Return, at the end of loop.Example Live Demopackage main import "fmt" type Node struct { value int next *Node } func NewNode(value int, next *Node) *Node{ var n Node n.value = value ... Read More
In this article, we are going to see how to execute a function before the component is updated in the DOM tree.This method is used during the updating phase of the React lifecycle. This function is generally called before the component is updated or when the state or props passed to the component changes. Don’t call setState() method in this function. This method will not be invoked if shouldComponentUpdate() methods return false.Note: This method is now deprecated.SyntaxUNSAFE_componentWillUpdate(nextProps, nextState)ExampleIn this example, we will build a color changing React application which calls the componentWillUpdate method when the component is updated in the DOM ... Read More
ExampleSuppose we have the following binary tree.Postorder Tree Traversal Output − 2 4 5 3 6 7 1.Approach to solve this problemStep 1 − If the root node of the given tree is nil, then return; else, follow the steps given below.Step 2 − Traverse the Left sub-tree.Step 3 − Traverse the Right sub-tree.Step 4 − Print the root node data.Example Live Demopackage main import "fmt" type Node struct { data int left *Node right *Node } func (root *Node)PostOrderTraversal(){ if root !=nil{ root.left.PostOrderTraversal() root.right.PostOrderTraversal() fmt.Printf("%d ", root.data) ... Read More
In this article, we are going to see how to execute a function when the component is deleted from the DOM tree.This method is called during the unmounting phase of the React Lifecycle, i.e., before the component is destroyed or unmounted from the DOM tree. This method is majorly used to cancel all the subscriptions that were previously created in the componentWillMount method.Never call this.setState() inside the componentWillUnmount method as this component is never going to be re-rendered again.SyntaxcomponentWillUnmount()ExampleIn this example, we will build a React application which displays the list of all users. On clicking the 'Delete User' button, ... Read More
ExampleApproach to solve this problemStep 1 − Define a method that accepts the head of a linked list.Step 2 − If head == nil, return the head.Step 3 − Initialize the index as i := 0.Step 4 − Iterate the given linked list from its head.Step 5 − If index i matches with the given index (to be updated), then update that node.Step 6 − Else, return head.Example Live Demopackage main import "fmt" type Node struct { value int next *Node } func NewNode(value int, next *Node) *Node{ var n Node n.value = value n.next = ... Read More
In this article, we are going to see how to execute a function if the props passed to the component is updated in the DOM tree.This method is used during the updating phase of the React lifecycle. This function is generally called if the props passed to the component change. It is used to update the state in response with the new received props. setState() method doesn’t generally call this method again.Note: This method is now deprecated.SyntaxUNSAFE_componentWillReceiveProps(nextProps)ExampleIn this example, we will build a color-changing React application which will call the componentWillReceiveProps method when the props of the component are updated.Our first ... Read More
ExamplesApproach to solve this problemStep 1 − Define a method that accepts the head of a linked list.Step 2 − If head == nil, return the head.Step 3 − Initialize the index as i := 0.Step 4 − Iterate the given linked list from its head.Step 5 − If the index i matches with the given index (to be updated), then update that node.Step 6 − Else, return head.Example Live Demopackage main import "fmt" type Node struct { value int next *Node } func NewNode(value int, next *Node) *Node{ var n Node n.value = value n.next ... Read More
In this article, we are going to see how to execute a function before the component is loaded in the DOM tree.This method is used during the mounting phase of the React lifecycle. This function is generally called before the component gets loaded in the DOM tree. This method is called before the render() method is called, so it can be used to initialize the state but the constructor is preferred.This method is generally used in server-side rendering. Don’t call subscriptions or side-effects in this method; use componentDidMount instead.Note: This method is now deprecated.SyntaxUNSAFE_componentWillMount()ExampleIn this example, we will build a ... Read More
In this article, we are going to see how to execute a function when the component is updated in the DOM tree.This method is called only when the component gets updated or when the props passed to it change. It isn’t called for the initial render of the component. This method is majorly used to perform some operations which are needed to be executed only if the DOM is updated.To avoid any performance issues, it is advised to use this method with conditional loop like −componentDidUpdate(prevProps, prevState) { if (prevState.text !== this.state.text) { // Write logic ... Read More