Stack Overflow
Stack Overflow

Questions tagged [conditional-rendering]

Conditionally choose which jsf tags to convert to DOM

Conditional rendering is selectively choosing which jsf( or jsp) components will be translated to the DOM elements by the javax.faces.render.Renderer in jsf framework. All jsf components have attibute rendered which evaluates to boolean. Based on this boolean Renderer chooses to create or not create the dom with this particular element.

386 questions
4
votes
2 answers

How to do conditional rendering according to screen width in react?

there is a problem, I don't know how to implement the component technically correctly. I want to do conditional rendering of an element depending on the device screen. Example: if the screen is less than 700 px then I make one conclusion, if more…
Евгений Морозов
  • 41
  • 1
  • 1
  • 2
4
votes
2 answers

Prevent FlatList re-rendering causing performance problems

I'm building a React Native App using Hooks and ES6. The Home screen fetches some data from API and display it as image galleries. The Home screen is the parent component which includes a slideshow gallery and a Flatlist as children. 1) Slideshow -…
Butri
  • 339
  • 8
  • 22
4
votes
2 answers

Conditional rendering not displaying - ReactJS

I have a log out button that I only want to show when the user is logged in. I have created a function for this purpose and included the function in the return part of react but it's not working. This is the function: const ifloggedin = () => { …
Alexander Bishop
  • 99
  • 6
4
votes
1 answer

Conditional rendering in react for a multi language app in react

I am working on a react app that is going to be launched for different countries. In each country some components will be the same but others are going to be different. i.e France will have - Component A - Component B - Component C Germany…
Emmanuel Orozco
  • 369
  • 1
  • 10
4
votes
1 answer

Conditional rendering based on checkbox input in Vue.js

I'm attempting to conditionally render form elements based on user input in Vue, and it is not going well. I know how to do this using VanillaJS or jQuery, but I'm struggling to translate that knowledge into using Vue's built-in conditional…
Amanda Harvey
  • 529
  • 5
  • 24
4
votes
1 answer

Can I use multiple booleans for conditional rendering in React?

I want to do something like the following in a React component:
{this.props.isOpen && this.state.isReady &&
Hello!
}
Is it possible to use multiple booleans for conditionally rendering components in React? Could this…
user3802348
  • 2,502
  • 11
  • 36
  • 49
3
votes
2 answers

Conditionally render JSF components for printing

I want to print only a certain part of my webpage (so not the whole page). How can I achieve this in JSF?
SnIpY
  • 662
  • 2
  • 10
  • 27
3
votes
3 answers

React: How to use conditional render and react-hooks to update another component's state?

I'm new to React. I'm trying to create a Login/Register Screen. I have three components called Login, Register and SlidingCard. I render these componenets on other jsx file called Screen. In SlidingCard.jsx i have a div and inside this div there are…
Görkem Tandoğan
  • 33
  • 4
3
votes
2 answers

How to display the content of a specific button after one of three buttons is clicked? All buttons should be hidden after one of them was clicked

Goal: I should display the specific contents of a specific button after one of three buttons was clicked. Then, after the specific button is clicked, all three buttons should be hidden and replaced with the contents of the clicked specific…
Ralph Henry
  • 122
  • 1
  • 13
3
votes
1 answer

How to build "edit" button in JSF and switch between h:outputText and h:inputText

How can I create an "edit" button so that when the button is clicked it will change the h:outputText to h:inputText?
akub
  • 99
  • 2
  • 10
3
votes
1 answer

How to write a test for conditional rendering component depended on useState hook in React?

I'm trying to write a test for my functional component, but don't understand how to mock isRoomsLoaded to be true, so I could properly test my UI. How and what do I need to mock? import React, { useState, useEffect } from 'react'; import {…
Simeon Johns
  • 33
  • 3
3
votes
1 answer

Nested v-tabs: Conditionally render the child tabs in order to show slider

I use nested tabs and have problems displaying active tabs. As described in this bug report, the tab slider of the nested tabs is only displayed after you have clicked on it. Conditional rendering is suggested as a solution. I have already tried…
C-Jay
  • 621
  • 1
  • 11
  • 22
3
votes
1 answer

Reset response to null after search input is cleared Vue.js

How do I reset a my response to NULL, as it is in my data upon the clearing/deleting of the query in my search bar? I've vaguely achieved this with v-show and a query length, but I know its not really correct because it's hiding the results, not…
maxineheadroom
  • 91
  • 8
3
votes
2 answers

How to render a component, that contains an opened and not closed tag? React.js

I have an objective to make a component, that renders cards with nested ul tags like this: from data like this, that's being passed down with props from a parental component: For that I set markers at the end of the lines where the nested ul…
Sth
  • 522
  • 8
  • 21
3
votes
3 answers

Conditional rendering based on user input

I've just started learning React and am struggling with conditional rendering. I want to render components based on form input but i'm not sure what needs to be done or where it needs to be executed. I have imported my Form component which has the…
Thomas Allen
  • 725
  • 5
  • 17
  • 30
1
2
3
…
25 26