Why are inline ref callbacks or functions not recommended?
- They can cause memory leaks
- They can introduce performance issues
- They are not compatible with all browsers
- They can interfere with the component lifecycle
Inline ref callbacks or functions are not recommended because they can cause memory leaks in your application. When using an inline ref callback, the function is recreated on each render, which can result in a buildup of references that are not properly cleaned up by the garbage collector. This can lead to memory leaks over time. It is recommended to use the createRef() API or a callback ref defined outside of the component to avoid these issues.
How do you set a default value for an uncontrolled component?
- Use the value attribute
- Use the defaultValue attribute
- Use the setState() method
- Use the props attribute
In React, uncontrolled components are form components that store their own state internally. To set a default value for an uncontrolled component, you can use the defaultValue attribute. This will set the initial value of the component when it first renders.
Give an example of reselect usage?
- A selector that returns the length of an array
- A selector that filters and sorts data from the Redux store
- A selector that computes the sum of two numbers
An example of reselect usage is a selector that filters and sorts data from the Redux store. This selector can take other selectors as input and use them to filter and sort the data before returning it. For example, you could create a selector that filters a list of items by a certain category and then sorts the results by price. This selector would only recompute when the input selectors (category and items) have changed, which can help to improve performance.
How to use React label element?
In React, you can use the standard HTML "label" element to associate a label with an input field or other form element. To do this, you can use the "for" attribute on the label element, and set it to the "id" of the input field. In JSX, you can use the "htmlFor" attribute instead of "for", because "for" is a reserved keyword in JavaScript.
How to use styles in React?
- Use the CSS module
- Use the className attribute
- Use the inline-style attribute
- Use the style attribute
In React, you can use the style attribute to apply styles to a component. The style attribute takes an object that contains CSS properties and values, similar to inline styles in HTML.
How to write comments in React?
- By using the /* */ syntax
- By using the // syntax
- By using the syntax
- By using the {/* */} syntax
In React, comments can be written using the {/* */} syntax. This syntax allows comments to be included directly in JSX code without causing syntax errors. Comments can be used to provide additional information or documentation about components, or to temporarily disable parts of the code for debugging purposes.
sWhat are HOC factory implementations?
- Higher-order components that return a function
- Higher-order components that return a component
- Higher-order components that are used to create other higher-order components
HOC factory implementations are higher-order components that return a function. This function can then be used to create a new higher-order component that has a specific set of props or behavior. This can be useful for creating reusable HOCs that can be customized for specific use cases. For example, you could create a withData HOC factory that takes a data source as an argument and returns a HOC that fetches and passes data to the wrapped component.
How do you use contextType?
- By passing the context value as a prop
- By using the useContext() hook
- By assigning the contextType property in the class definition
- By creating a context consumer
The contextType property is used to consume a context value in a class component in React. To use contextType, you assign the context object to the contextType property in the class definition. This allows the component to access the context value using the this.context property. ContextType can only be used with a single context object and can only be used in class components.
What is the purpose of default value in context?
- To provide a fallback value when a context value is not available
- To override the context value in child components
- To provide a default value for the context provider
- To prevent child components from accessing the context value
The default value in context is used to provide a fallback value when a context value is not available. When a component consumes a context value, it looks for the context value in its ancestors. If no ancestor provides a value, the default value is used instead. The default value is typically used as a fallback or to provide a default value for the context.
What are error boundaries in React v16?
- A way to create dynamic forms
- A way to handle errors in React components
- A way to optimize rendering performance
- A way to render components outside the normal DOM
Error boundaries are a way to handle errors in React components. In React v16, error boundaries are special components that catch and handle errors that occur during rendering. This can help prevent the entire application from crashing due to an error in a single component.