Как объединить стили

Я думаю, это должно быть

<nav className = {styles.navbar,styles.navbar-default}></nav>

Или вы также можете попробовать это. В этом случае второе свойство переопределит то же свойство стиля в styles.navbar.

<nav className=style = {Object.assign({}, styles.navbar, styles.navbar-default)}></nav>

Итак, у вас есть scss, как показано ниже.

export default {
     navbar: "navbar-default"
}

Предполагая, что вы использовали экспорт имени/по умолчанию из вашего файла scss, вы должны использовать переменные из файла, как показано ниже:

import styles from './Header.scss';

class Header extends Component {
render() { return (
  <nav className = {styles.navbar}>
  </nav>
    );
  }
}