rsuite/rsuite

A suite of React components

moonlit

@moonlitusun

table 的sort icon好像默认太小了

mirik999

@mirik999

Hi, i want to make theme switching in react (17^) , can someone did before ?
i'm trying to require css files conditionally but in my case it works just once ( doesn't matter to light or dark )
Here is my code from index.js

store.subscribe(() => {
  const theme = store.getState().theme;
  if (theme.name === 'dark') {
    require('rsuite/dist/styles/rsuite-dark.min.css');
  } else {
    require('rsuite/dist/styles/rsuite-default.min.css');
  }
});

HamedEzati

@HamedEzati

i want to use icon when my internet connection in disconnected. how can i do it?

TheColdPot

@TheColdPot

you can do it

use navigator.onLine to get a boolean when the page was just rendered

and also, DOM has a event offline

it like document.addEventListener('offline', () => {/*your code*/})

TheColdPot

@TheColdPot

you can use it with React state, like this (pseudo code)

function App() {
  const [online, setOnline] = useState(navigator.onLine);
  useEffect(() => {
    document.addEventListener('offline', () => setOnline(false));
    /* Or Jquery 
     * $(document).on('offline', () => setOnline(false);
     */
  }, []);
  return online ? <MyWebApp /> : <MyWebAppPlaceHolderWhenOffline />
}

or class

class App extends React.Component {
  constructor(props) {
    super(props);
    this.state = { online: navigator.onLine }
    document.addEventListener('offline', () => this.setState({online: false}));
    /* Or Jquery 
     * $(document).on('offline', () => this.setState({online: false}));
     */
  }
  render() {
    return this.state.online ? <MyWebApp /> : <MyWebAppPlaceHolderWhenOffline />
  }
}

KaganHamzacebi

@KaganHamzacebi

hello, everyone. Is there a way to use rsuitejs with create-react-app?

Andrew Keturi

@adketuri

@KaganHamzacebi yes, https://rsuitejs.com/guide/use-with-create-react-app/

Pablo Sepulveda V

@paseva1980_twitter

hello, my problem Cannot read property 'Body' of undefined on <Sidenav.Body

Maxus

@MaxusAdmin

Hi everyone, has anyone been able to execute the Webpack compiles multiple themes instruction? It is already difficult to calculate how much time I spend, but I did not manage to do it. maybe there is a working instruction?

1 reply

it's really problem for me, but i don't want to leave this issue unresolved

Duong Nguyen

@nhduong29

Hi all, For the table, we have an issue with editable cell.
When we click to edit the cell the scrollbar of table content will be scroll to top.
Do you guys have any idea to fix it?

1 reply

lior146

@lior146

hey has anyone created Rsuite admin dashboards or free or paid themes?

The style here is a bit basic and looking for a designer or theme that can beautify it

Pravin Kumar

@vctpravin

Hi guys, is it possible to create a scrollbar for only a particular column in tree-table. For example, I am having tree in one column and actions in another column which is transparent. When i scroll the table horizontally the action icons come on top of the column(tree). I want to restrict scrolling to tree column only. Thanks

@nhduong29 you may be editing the table data directly, try to put it in useState. I had that issue earlier, when i moved my data to redux, the issue was solved

Tiago Perdigão

@TiagoPerdigao1983

Hi everyone. Is there a hooks version of the Open/Close menu of the Sidenav?

M Khabibur

@imkhrr

Hello, is there a way to get align middle working ?
I followed example, but it isn't work like that

Deco Moraes

@decomoraes

Hey guys, I would like to translate the "page" word in the display length selector, e. g. "20 / page" to "20 / página"

hugodezordo

@hugodezordo

hello, do you know how I can search for a parent folder in the search bar of the Cascader component ?

Tiago Perdigão

@TiagoPerdigao1983

hello. Is there a way to remove with css the onclick ripple effects?

2 replies

GameGC

@GameGC

Hey guys

index.js:1 Warning: Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in your application. To fix, cancel all subscriptions and asynchronous tasks in the componentWillUnmount method.
in FormControl (created by Context.Consumer)
in FormControlWrapper (created by defaultProps(FormControlWrapper))
in defaultProps(FormControlWrapper) (at ProfilePage.js:130)
in div (created by FormGroup)
in FormGroup (created by defaultProps(FormGroup))
in defaultProps(FormGroup) (created by withStyleProps(defaultProps(FormGroup)))
in withStyleProps(defaultProps(FormGroup)) (at ProfilePage.js:128)
in BoolField (at ProfilePage.js:156)

i need help

here is code

not works changing value and this error and console

sbitproz

@sbitproz

I wondered if your Table component supported adding a filter control in the column header? Or allowed the dev to inject a component into a column header? Couldn't see this in the examples

Shweta Kale

@raibove

How to off the tooltip in SideNav?

1 reply

Simon Guo

@simonguo

@nhduong29

Iosvany Alvarez

@lucasgio

Hello, I am new to this framework and it is very good. By the way, I would like to know how you can submit a form and collect the data in a useState? Thank you.