react: scss使用样式

方式一: 将样式作为模块使用

//List.tsx
import styles from '@/styles/apppublish.module.scss'
<div className={styles.contentOverflow}></div>

//apppublish.module.scss
.contentOverflow {
    height: 100%;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
}

方式二:在组件中使用文件中的样式,className来对应


// index.js

import React from "react";
import '@/styles/empty.module.scss'

function Empty() {
  return (
    <div className="empty">
      <p>暂无相关内容</p>
    </div>
  )
}

export default Empty;

// empty.module.scss
.empty {
  width: 100%;
  height: 100%;
  margin: 0 auto;
  text-align: center;
}


你可能感兴趣的:(react,react.js,scss,javascript)