Encountered "Error: Material-UI: capitalize(string) expects a string argument." when using snackbar in React Material-UI

Viewed 5250

I am using snackbar in Material-UI, and I encountered Error: Material-UI: capitalize(string) expects a string argument.

My code

    this.state = {
      snackBarOpenVertical: "bottom",
      snackBarOpenHorizontal: "right",
    };

            <Snackbar
              // Neither of the 2 following approaches works.
              anchorOrigin={"bottom", "right"}
              anchorOrigin={this.state.snackBarOpenVertical, this.state.snackBarOpenHorizontal}

              open={true}
              onClose={this.handleSnackBarClose}
              message="I love snacks"
            />

I think the problem is in the anchorOrigin field, because it worked when I commented that 2 lines out though I couldn't specify the location of the snackbar that way.

And as I commented above, neither of the 2 approaches works.

Snackbar document: https://material-ui.com/components/snackbars/

Could anyone point out where I did wrong?

Thanks in advance!

1 Answers

From the docs, anchorOrigin takes an object like this:

anchorOrigin={{
  vertical: 'bottom',
  horizontal: 'left',
}}

You are omitting the inner {} and vertical and horizontal property names in your implementations

Related